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

# Magento

> Add the homie AI chat widget to your Magento 2 store via layout XML or the footer miscellaneous HTML setting.

You can add homie AI to Magento 2 without writing a module. The quickest path is the admin **Content → Configuration** footer miscellaneous HTML setting; for theme-level control, add the script through layout XML.

<Note>
  Before you start, make sure you have:

  * An assistant created on the platform
  * Your embed script copied from the assistant's **Publish** area
  * Admin access to your Magento 2 store
</Note>

## Add the script to your storefront

<Steps>
  <Step title="Copy your embed script">
    Open your assistant on the platform, go to its **Publish** area, and copy the script. It already contains your `chatbotId`.

    <Frame>
      <img src="https://mintcdn.com/homieai/t1ZSM74lXOpzsQLS/images/integrations/connect.png?fit=max&auto=format&n=t1ZSM74lXOpzsQLS&q=85&s=ddc2630812f2d8706ba54bc3b19cb1a3" alt="Platform Publish area showing the copyable script snippet" width="1340" height="978" data-path="images/integrations/connect.png" />
    </Frame>
  </Step>

  <Step title="Choose how to add it">
    <Tabs>
      <Tab title="Admin footer HTML (recommended)">
        In the Magento admin, go to **Content → Design → Configuration**, edit the relevant store view, and open **HTML Head** or **Footer**. Paste the script into **Miscellaneous HTML** (footer):

        ```html theme={null}
        <script
          src="https://cdn.yourhomie.ai/embed.min.js"
          chatbotId="YOUR-CHATBOT-ID"
          defer
        ></script>
        ```

        Save the configuration.
      </Tab>

      <Tab title="Layout XML">
        In your custom theme, add a block to `default.xml` that references a small template containing the script, or use a `<block>` with the script in the `before.body.end` container:

        ```xml default.xml theme={null}
        <referenceContainer name="before.body.end">
            <block class="Magento\Framework\View\Element\Template"
                   name="homie.embed"
                   template="Magento_Theme::html/homie-embed.phtml" />
        </referenceContainer>
        ```

        Place the embed `<script>` in `homie-embed.phtml`.
      </Tab>
    </Tabs>
  </Step>

  <Step title="Flush the cache">
    Flush the Magento cache so your change is served.
  </Step>
</Steps>

<Check>
  Refresh your storefront. The homie chat bubble appears in the bottom-right corner. Open it and send a test message.
</Check>

## Troubleshooting

* **No bubble showing?** Flush the Magento cache, then clear your browser cache or use an incognito window.
* **Applied to the wrong store?** Confirm you edited the correct **store view** scope in the configuration.

For deeper configuration and methods, see the [Client API](/en/api-reference/client/overview).

## Next steps

<CardGroup cols={2}>
  <Card title="Client API" icon="code" href="/en/api-reference/client/overview">
    Configure the widget and call methods from your site.
  </Card>

  <Card title="Installation overview" icon="plug" href="/en/user-guide/installation/overview">
    Compare install methods for every platform.
  </Card>
</CardGroup>