AI Search | Search Results Page¶
This guide will show you how to integrate AI Search onto a dedicated search results page on your site (e.g., example.com/search). Direqt will automatically redirect user queries to your specified URL and display search results on that page.
To set up AI Search on a dedicated search page, follow the steps below:
1. Create A Search Results Page¶
Use of this layout requires the existence of a search page on your website. If you don't yet have one, refer to your CMS documentation for creating a new page, or use an existing search results template if available.
2. Specify Your Search Page URL¶
In the Direqt console, go to Chatbot Settings < Customize. Locate the "Search Page URL" input box, and enter the URL of your website's search page in the box.
3. Add Your Embed Script¶
Paste your personalized Direqt embed script into either the <head> or <body> section of your HTML file.
This script will look something like this, with your unique bot ID in the id field:
Note
Your bot ID can be found in the Direqt console under "Chatbot Settings".
4. Add The Direqt Search Container¶
On your search results page, paste the following code where you want the AI Search interface to appear on the page:
That's it! Your search results page is ready for use.(Optional) Using Your Own Search Bar¶
By default, the Direqt AI Search interface contains a built-in search bar. If you wish to remove the Direqt search bar from the page and instead use your own, add a new CSS class of direqt-search-input to your search bar on the search reuslts page.
For example:
| Existing | New |
|---|---|
<input type="text" placeholder="Search"> |
<input type="text" placeholder="Search" class="direqt-search-input"> |
When we detect this class, we will automatically remove the Direqt search bar from the interface and respond to inputs from your search bar.