Shopify

Drop the snippet into theme.liquid so it runs on every storefront page. We’ll ship a Shopify App Store listing later, but the script-tag path works on every plan today.

1. Edit `layout/theme.liquid`

In Shopify admin: Online Store → Themes → Actions → Edit code.

Open layout/theme.liquid and add the following just before </body>:

{% if shop.metafields.wholisphere.key %}
  <script
    src="https://cdn.wholisphere.ai/embed.js"
    data-key="{{ shop.metafields.wholisphere.key }}"
    data-position="bottom-right"
    data-wholisphere
  ></script>
{% endif %}

2. Set the `key` metafield

In Shopify admin: Settings → Custom data → Shop metafields → Add definition.

Namespace + key: wholisphere.key
Type: Single line text
Value: paste your org_yourkey from the dashboard

Storing the key as a metafield (rather than hard-coded) lets you rotate it without touching the theme.

3. Cache invalidation on theme deploys

If you push themes via Shopify CLI in CI, add this step:

- name: Invalidate Wholisphere cache
  uses: wholisphere/cache-invalidate-action@v1
  with:
    api-key: ${{ secrets.WHOLISPHERE_API_KEY }}
    urls: "https://${{ vars.SHOP_DOMAIN }}/*"

Theme app extensions (Online Store 2.0)

For OS 2.0 themes, you can ship the snippet as a theme app extension so merchants don’t have to edit code. Get in touch at partners@wholisphere.ai for the early-access partner SDK.

Verifying

Open your storefront. The FAB lands in the bottom corner. Open it on a product page and try Read this page — the agent walks the title → description → reviews structure.