PandoraBot
AI Search design: pick a search bar, how results open and what they show. Then put it on your site.
We read your homepage and tick each step below. After a change, clear your site's cache and check again.
In Settings › Commerce, find AI product search. Inside it, switch on AI Search on your site and press Save changes at the bottom. It is part of the PRO and ESHOP plans.
The search uses the same code as the chat bubble. Paste this once, just before </body>, on every page:
Already have an older PandoraBot code? Delete it and paste this one in its place. The older code (it starts with window.addEventListener("load") waits for every image on the page, so the search starts seconds later. Keep only one.
⚡ Faster (recommended): also paste these two lines at the top of your site's <head>, right after <meta charset>. Your browser then starts downloading our script while the page is still loading, so the AI search is ready sooner. Lower down they help less: the browser reads them late. The code above still goes before </body>.
Pick one. You can change it any time; nothing on your site is deleted.
Recommended: B with the ⚡ Instant code. Your bar becomes part of your page, so it shows at once, like a built-in search box, and your old box never shows. The Instant code appears below after “Use this” on B and Save changes.
Easiest, no code. Our bar takes the place of your site's search box, which is only hidden.
We look for:
Your box is not found? Put its CSS selector (e.g. #search input) in Settings › Commerce › AI product search.
Paste this where the bar should appear (header, a page, a banner):
<div class="pandorabot-search"></div>
⚡ Instant version (fastest): the same place, but your bar is already drawn in the code, so it appears together with your page — like a normal search box — even before our script loads; then it simply becomes the AI search. Paste it instead of the line above (and instead of your old search box). Copy it again after you change the design.
Your bar is drawn here from the preview…
Typed something before the AI search woke up? It is kept. Pressed Enter that early? It opens your shop's own search page, so no search is lost.
After “Use this”, press Save changes at the top. Also check that Use our search bar is on (Design › Search bar).
<head> lines: your theme's “header scripts” box, or WPCode › add to header.theme.liquid, paste it just before </body>, Save.<head> lines: in theme.liquid too, just after <head>.sections/header.liquid (or your header section), paste the code where the search should be, Save.</body> in your theme's footer template.<head> lines: your theme's custom code “header” box, or just after <head> in your theme's header template — e.g. in place of another search tool's script line.</body>, on every page (or in your shared footer).<head> lines once, inside <head>, on every page.<input type="search"> or name="search"; otherwise set its selector.Enter opens a full results page inside your shop, with filters, sorting and more pages. Without it, Enter shows the results in the dropdown.
anazitisi. WooCommerce: Pages › Add New. Shopify: Online Store › Pages › Add page.Another search tool on your site (Findbar, Doofinder, Klevu…) fights over the same box: remove its script line. Then clear your site's cache (and your theme's), and press Check my site above.
Any link or button on your site can open the search panel:
<button type="button" onclick="window.postMessage({type:'pandorabot:search_open',q:''},'*')">Search</button>λάμπα. Results should appear in about a second.Not working?