How to add smart search to Shopify

Prepare the catalog and code#

1. 1

   Connect your product feed in Indexa and wait for the catalog to load.

2. 2

   In “Widget → Integration”, enter the website URL and copy the universal code.

Add the code to your theme#

1. 1

   Open “Online Store → Themes”. Make a duplicate of the theme before editing.

2. 2

   Choose “Edit code” and open “Layout → theme.liquid”.

3. 3

   Paste the complete Indexa universal code before the closing </head> tag.

4. 4

   Save the changes. If you edited a theme copy, test it and publish that theme.

Example for theme.liquid#

This is a template fragment. Keep the existing theme code and system calls; do not replace the entire file with the example.

<head>
  <!-- Existing theme code -->
  {{ content_for_header }}

  <script async src="INDEXA_LOADER_URL_FROM_DASHBOARD"></script>
</head>

Search appears on pages using the template where you installed the code.#

If your store uses other layouts, check those pages separately.

Checkout uses separate customization rules and is not covered by this example.

Check search after installation#

Open your store, then use “Check installation” in Indexa. Select the desktop and mobile search elements and save.

Search for a product, follow its link and close the widget. Repeat on the home, category and product pages.

After changing or updating your theme, check that the code and selected search elements still work.