Step 2: Adding Search to Your WordPress Site
Create a Search Experience
If your Search experience is ready to be added to WordPress, you can skip this step!
If you have a Yext account, but still need to create a Search experience to embed on your WordPress site, we recommend installing a solution template by following these steps: 1. Navigate to Apps > Solutions in your Yext account.
Select the solution that most closely fits your needs.
Click View Solution. The Admin Console will appear in a new window.
In the upper right corner of the Admin Console, click Apply.
Enter your Account ID, which you can find in any URL on your account, e.g. “https://www.yext.com/s/#######/apps/solutions/”.
Click Start Authorization Flow.
A new window will pop up. Click Authorize.
Return to the Admin Console and click Continue.
Enter your Account ID once again, and click Save.
In the popup modal, click Continue, and finally, Confirm.
You will need to manually push your experience live by publishing your experience in the Pages screen. Back in your account, navigate to Pages > your-site-search > View the Production Environment > Publish.
This will create a pre-built search experience based on the solution template you selected. Once downloaded onto your account, you can always modify this pre-built experience by adding verticals , altering the frontend , and more.
Add Verticals for WordPress Data
Once your search experience is created, you need to add new verticals for your WordPress data. You can also follow this guide for a generic overview of adding verticals to Search experiences.
Check that your WordPress entities contain all the information you would like to be searchable. Our connectors automatically bring in a set of basic fields, but you can always modify your connector to bring in additional information from your WordPress site.
Create the vertical(s) in your search configuration (Search backend). Click on Search in your main navigation bar. Navigate to the Verticals section of your Search experience, and click Settings for > + Add Vertical. Select the WordPress entity type you wish to add, and then edit the page to configure the vertical. You’ll want to add at least a few searchable fields so that users can find information from these entities. You can also add direct answers , sorting rules , and more. Make note of the vertical key, as you will use it in the next step.
Navigate to Pages to configure the frontend of your search experience. Click View Code Editor and edit the Master branch (click the small pencil). In the top right corner, click Tools > Jambo Commands > Add Vertical. Create a page name, input the vertical key from your backend, and select which card format you would like the entity information to inherit (we recommend the settings in the screenshot below!).
Commit your changes, go back to your Site, publish your search experience in Staging Environment and your Production Environment.
Install the Yext AI Search Plugin (v2) on WordPress
Log into your WordPress account and navigate to the Yext AI Search plugin .
Install the Yext plugin into your Wordpress account.
Once the plugin is installed, you will see it in your Plugins section. When you are ready to set up the plugin, click Activate.
Follow the step-by-step instructions to embed your search experience onto your site.
After these introductory steps, you will need to copy over various details from your Yext account to WordPress. You should have the following values from your Yext account on hand:
- API Key: This can be found in the “Experience Details” section in Search. Make sure you’ve selected the correct search experience if you have multiple.
- Experience Key: Like the API Key, this can also be found under “Experience Details”.
- Business ID: Can also be found under “Experience Details”, or in the URL of any page on your Yext account.
- Search iFrame URL: This is the Production URL of your search experience, found in Pages.
Once you’ve input your details, click Save and Continue.
If you have native WordPress search any of your WordPress pages, and would like to automatically replace that with Yext AI Search, click Enable Global Search. If you don’t have native WordPress search on your site, or don’t want to replace current instances, leave the box unchecked. Click Save and Continue.
In the next step, you can customize the styling of your search bar and see the changes live. If you aren’t familiar with any of the inputs, click the tooltips to learn more about what each means. Click Save and Continue.
Select from the dropdown menu which page you would like to add your search results to. Note: you can always edit this or add more search bars using drag-and-drop Gutenberg blocks (See the note on Step 9, below). Click Save and Continue.
Click Publish to go live!
We recommend using drag-and-drop Gutenberg Blocks to add your search bar or search results to any additional pages. Navigate to any page on your WordPress site, click the + button in the upper left corner to add a block, and scroll down to the Yext Blocks section. Drag and drop your search bar or search results onto the page, click Update in the upper right corner, and your search experience is live!
You can follow this GIF for visual instructions.
Whenever you make changes to your search experience or add new data to your Yext account, those changes will be immediately reflected on your WordPress search experience!