Install HoverBot on your store

Connect in one step. The plugin creates your chatbot and allows your store domain for you.

1. In WordPress admin go to Plugins → Add New → Upload Plugin, choose the zip, then Install and Activate.
2. Open WooCommerce → HoverBot Chat (Settings → HoverBot Chat without WooCommerce).
3. New to HoverBot: fill in the form and click Create account and connect. Already a customer: paste your Chatbot ID and Widget Key.
4. Visit your store. The chat appears in the corner of every page.

The HoverBot Chat app for the Shopify App Store is being prepared. Until it is listed, add the code to your theme in two minutes.

1. In Shopify admin go to Online Store → Themes → ⋯ → Edit code.
2. Open layout/theme.liquid and paste the code just before </body>. Save.
3. In HoverBot, add yourstore.myshopify.com and your custom domain to the chatbot's Allowed Domains.

<script>window.HOVERBOT_CONFIG = { chatbotId: "YOUR_CHATBOT_ID", apiKey: "YOUR_WIDGET_KEY" };</script>
<script src="https://cdn.hoverbot.ai/widget.js" async></script>

Configure per store view. Includes the CSP allowlist, so strict checkout pages keep working.

1. Unzip into app/code/HoverBot/Chat on your server.
2. Run bin/magento module:enable HoverBot_Chat, then bin/magento setup:upgrade and bin/magento cache:flush.
3. Go to Stores → Configuration → HoverBot → HoverBot Chat, paste your Chatbot ID and Widget Key, set Enable to Yes.

Upload, configure, done. Optionally hide the chat on cart and checkout.

1. Go to Modules → Module Manager → Upload a module and choose the zip.
2. Click Configure on HoverBot Chat.
3. Paste your Chatbot ID and Widget Key and Save.

Uses Script Manager. No theme editing.

1. Go to Storefront → Script Manager → Create a Script.
2. Placement: Footer. Location: All pages. Category: Essential. Type: Script.
3. Paste the code and Save. Add your store domains to the chatbot's Allowed Domains.

<script>window.HOVERBOT_CONFIG = { chatbotId: "YOUR_CHATBOT_ID", apiKey: "YOUR_WIDGET_KEY" };</script>
<script src="https://cdn.hoverbot.ai/widget.js" async></script>

Needs a premium plan with a connected domain.

1. Go to Settings → Custom Code → Add Custom Code.
2. Paste the code below. Apply to All pages, load once, place in Body - end.

<script>window.HOVERBOT_CONFIG = { chatbotId: "YOUR_CHATBOT_ID", apiKey: "YOUR_WIDGET_KEY" };</script>
<script src="https://cdn.hoverbot.ai/widget.js" async onload="document.readyState==='complete'&&!window.hoverBotWidget&&(window.hoverBotWidget=HoverBotWidget.init(window.HOVERBOT_CONFIG))"></script>

Uses Code Injection, available on Core plans and above.

1. Go to Settings → Advanced → Code Injection.
2. Paste the code into Footer and Save.

<script>window.HOVERBOT_CONFIG = { chatbotId: "YOUR_CHATBOT_ID", apiKey: "YOUR_WIDGET_KEY" };</script>
<script src="https://cdn.hoverbot.ai/widget.js" async></script>

Site-wide footer code.

1. Go to Site settings → Custom code.
2. Paste the code into Footer code, Save, then Publish.

<script>window.HOVERBOT_CONFIG = { chatbotId: "YOUR_CHATBOT_ID", apiKey: "YOUR_WIDGET_KEY" };</script>
<script src="https://cdn.hoverbot.ai/widget.js" async></script>

For any other site that already runs GTM.

1. Create a tag of type Custom HTML.
2. Paste the code below, trigger it on All Pages, and publish the container.

<script>window.HOVERBOT_CONFIG = { chatbotId: "YOUR_CHATBOT_ID", apiKey: "YOUR_WIDGET_KEY" };</script>
<script src="https://cdn.hoverbot.ai/widget.js" async onload="document.readyState==='complete'&&!window.hoverBotWidget&&(window.hoverBotWidget=HoverBotWidget.init(window.HOVERBOT_CONFIG))"></script>