Step 1: Approach 1 - JS Snippet Integration

This first approach for creating a Search Results page is called the JS Snippet path, In this approach, you will embed the search results into a page you host and control. Follow the steps below if you’d like to proceed with this option.

1. Choose a Domain

The first step is to pick the URL for your search results. We recommend or /answers, but it’s up to you.

2. Create Page in your CMS

Using the chosen domain, stand up a page in your CMS. If you already have a search results page, then you can skip this step and move on.

3. Replace Content with Search Results

The next step is to embed the search results from Yext Search on that page.

<div id="answers-container"></div>
<script src="REPLACE_ME_PRODUCTION_URL/iframe.js"></script>

Note: Your Search Admin will likely provide PRODUCTION_URL to replace the REPLACE_ME_PRODUCTION_URL. If you are building your search experience end to end, it will be available once you publish to production (Visit Step 6 of our Deployment Guide for more informatioon Step 6: Publish to Production .)

To make the process quick and seamless for creating your search results page, you can use the Search Snippet Generator to automatically create the snippet you need above to integrate with the JS Snippet option.

To generate the snippet, navigate to your Yext account > Search > Experiences > Experience Details and select “Integrate Search on Your Site”. Follow Step 5 in this guide for complete steps on how to use the Search Snippet Generator.

search snippet generator

Generally this code snippet would be added between the header and the footer. At a high level the page structure might look something like this:

    <div id="answers-container"></div>
    <script src="REPLACE_ME_PRODUCTION_URL/iframe.js"></script>

Additionally, to display a specific page in your experience (like a vertical page, or an international subfolder), you can add the data-path attribute in your script tag.

By default, the script tag will pull in the root folder of your experience, landing users on the index.html page. Adding data-path to the script tag will append /[[data-path]] to the iframe’s src.

<div id="answers-container" data-path="locations.html"></div>
<script src="REPLACE_ME_PRODUCTION_URL/iframe.js"> </script>

4. Add H1 Header Tag

We recommend adding an h1 header tag to the page you are embedding the search experience on to clearly indicate what content is included on the page.

5. Update Meta Tags

The final step is to make sure the meta tags on the page make sense. You will want to update your title and meta description to match the experience you now deliver. These live inside the <head></head> tag on the page.


Add (or update) the <title> tag in the <head> to something like “{{Brand Name}} Searh | {{List of entity types}}”. Yext recommends around 60 characters or less.

<title>{{Your Brand Name}} Search | Locations, People, FAQs, Products</title>

Meta Description

Next you will want to update the meta description (<meta name="description">). For this tag we recommend 125 to 150 characters.

  content="Ask any question to find the answer you need from {{Your Brand Name}} today. Learn more about our {{list of entity types}}"

(Optional) Configure the JS Snippet to Work with your Analytics Platform

If you have custom analytics (like Adobe) that are hosted on your domain and will also be added to Search, follow Step 4 in this guide in addition to the ones above.

light bulb
We recommend funneling as much traffic as possible into search. One way to do this is to redirect any existing links into search that make sense. For example, if you have a “find a location” link on your website, redirect that to search or remove it entirely.