theme.liquid is the layout that wraps every storefront page. You paste the widget snippet into it.

​
Before you start

  • Your website widget. Kelu makes one for you when you create a knowledge base. Its Install tab shows these steps with your widget id and key already in the code.
  • Your store on the widget’s Sites it works on list (Install tab), for example https://yourstore.myshopify.com and your custom domain.

​
Add the widget

1

Open the theme code editor

In Shopify admin, go to Online Store → Themes. On your live theme, open the … menu and choose Edit code.
2

Open theme.liquid

It is in the Layout folder.
3

Paste the snippet before the closing body tag

theme.liquid
<script async src="https://widget.kelu.dev/kelu-widget.js"
  data-widget-id="YOUR_WIDGET_ID"
  data-client-key="kl_pk_..."></script>
</body>
Use your widget’s own snippet, or replace YOUR_WIDGET_ID and kl_pk_... with its values.
4

Save

Click Save. Each theme has its own theme.liquid, so repeat this for any other theme you publish.
Checkout pages do not use theme.liquid, so the widget does not appear there.

​
Check it works

Open your storefront. A round icon button appears in the bottom-right corner, with the tooltip Ask AI. Ask a question and check that the answer lists its Sources. Nothing there? See Troubleshooting.