> ## Documentation Index
> Fetch the complete documentation index at: https://anam.ai/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Add the Anam Widget to Shopify

> Add the Anam Widget to a Shopify theme, place the avatar across your storefront, and configure the allowed domain in Anam Lab.

Add a conversational AI avatar to your Shopify store using the [Anam Widget](https://anam.ai/docs/embed/widget/overview.md) -- no coding required.

> [card] [Cookbook: Adding the Anam Widget to Shopify](https://anam.ai/cookbook/widget-shopify)
>
> Step-by-step guide with screenshots for embedding the widget in your Shopify theme

## Overview

The Anam widget can be added to any Shopify store by editing the `theme.liquid` file. Once installed, the avatar appears on every page (or specific pages using Liquid conditionals).

## Quick Start

**1. Create a persona in Anam Lab**

Go to [Anam Lab](https://lab.anam.ai), create a persona, and configure its avatar, voice, and behavior. Navigate to the **Embed** tab and choose **Widget** to get your persona ID and configure the widget appearance.

**2. Allowlist your Shopify domain**

In the **Embed** tab, choose **Widget** and enter your Shopify domain (e.g., `https://your-store.myshopify.com`) under **Allowed Domains**, then select **+** to add the origin. Select **Publish** before testing the embed.

Add the origin visitors actually use, including any custom domain. See [origin format and matching rules](https://anam.ai/docs/embed/widget/installation.md#domain-allowlisting).

**3. Edit your Shopify theme**

In your Shopify admin, go to **Online Store > Themes > Edit code** and open `theme.liquid`. Add the widget snippet after the opening `<body>` tag:

```html theme={"system"}
<anam-agent agent-id="your-persona-id"></anam-agent>
<script src="https://unpkg.com/@anam-ai/agent-widget" async></script>
```

**4. Publish**

Click **Publish** in Anam Lab to make the persona live on your store.

> [!TIP]
>
> Use Shopify's Liquid conditionals to show the widget only on specific pages. See the [cookbook](https://anam.ai/cookbook/widget-shopify) for examples.

## Next Steps

> [card] [Widget Configuration](https://anam.ai/docs/embed/widget/configuration.md)
>
> Customize the widget's appearance and behavior

> [card] [Widget Events](https://anam.ai/docs/embed/widget/events.md)
>
> Listen for widget events in your Shopify theme


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.