Step 6: Integrate and Launch

Now that you’ve built and tested your Search experience, you’re ready to integrate it on your site!

Note

If you have been building Search experiences for a while, note the integration process has been streamlined.

Previously, you had to assign a domain to your Search experience before you could make a publish to a URL, which meant you had to decide on the integration method upfront. Now, on the new version of Pages (check out the Types of Pages doc), each site will have a placeholder domain that it publishes to until you set a domain. You don’t have to decide on the integration method until you’re ready to integrate the site on this step.

Pre-Integration

Many of these items were included in the guide previously, but it’s a good idea to double check these are set, as it’s often easy to skip over them.

1. (Subdomain integration) Add your favicon to the search results page. If you’re using the JS snippet method, this should be done on the page the search results will be iFramed into.
2. (Subdomain integration) Set meta description and meta title for all pages. If you’re using the JS snippet method, this should be done on the page the search results will be iFramed into.
3. Set up IP filtering if there are any IP addresses you don’t want to include in analytics as “external” traffic. Note that all users who log into the Yext platform will be tracked as “internal” via cookie.
4. Add the Google Analytics ID or Google Tag Manager ID .
5. (JS Snippet Integration) Block search engine crawlers (e.g. Googlebot) from crawling and indexing the Yext origin of the search results page (i.e. the Yext domain where they integrate the iFrame from like search.client.com.pagescdn.com). This is achieved by adding noindex meta tags to the search results page.
   1. Navigate to your layouts > headincludes.hbs
   2. Paste: <meta name="robots" content="noindex">

Integration

Hitchhikers Theme

1. Decide on integration method : JavaScript snippet (iFrame) or subdomain
   1. Choose client-hosted JS snippet integration if/when you are able to host the search results page somewhere on your existing site. This will ensure a more seamless UX, including keeping the header and footer across your site.
   2. Choose Yext-hosted subdomain integration if/when you are unable to host the search results page on your existing site. Consider how you will rebuild the header and footer modules to match your site.
2. Add a Search domain .
   1. JavaScript snippet method: Use the production version of the placeholder domain. The placeholder domain is automatically assigned when you create your Pages site. You must publish a deploy to production before the production URL is available to use.
   2. Subdomain method: You will need to set up a subdomain on your site.
      1. Select a subdomain - we recommend search.[brand].com.
      2. Use these instructions ( guide here ) to set up the CNAME record on your site.
      3. Add the domain they choose in the Yext platform (e.g. search.[brand].com).
3. Publish the frontend and backend to production.
4. Stand up the search results page .
   1. (Optional) Add Sitelinks search box schema to allow Google to redirect Google search traffic to your internal search.
5. Add or update the search bar . We recommend adding a prominent search bar in the header of your website and on your homepage to encourage users to use the search (e.g., expand the search bar by default rather than showing a search icon). You have the option to use a search bar or an overlay module.
   1. Check the UI looks good on mobile.
   2. (Optional) Style the search bar as necessary to ensure it is seamless with the rest of the site.
   3. (Optional) Add typed animation to prompt more users to search.
6. We also have options for you to integrate with partners , such as Zendesk and WordPress .

Search UI React

If the site you are adding a Search experience to is already built on React, build the Search experience directly onto a page.

Otherwise, integrate the Search experience using the subdomain method, as above.

Post-Live Testing

Right after you launch your Search experience and before you make any announcements, do some quick testing to ensure everything is working properly.

1. Click Testing: Click all clickable items
   1. Hardcoded prompts, CTAs, FAQ expansions, Filters, Pagination, “View All” links, etc.
2. Mobile Testing: Same as above, but in mobile view.
3. Confirm GA ID is present (if applicable)
4. Ensure that analytics are showing on the Search Home Screen
   
   

Congratulations on launching your Search experience!