One line of code. Any website.

</>Any website (HTML)

Works on any site where you can edit the HTML.

1. Copy your snippet.
2. Paste it just before the closing </body> tag on every page, or once in your shared footer or layout template.
3. Publish your site and open it in a browser. The pet appears in the corner.

WWordPress

Install the Chatmello plugin and connect in one click. No code to paste.

1. Download the Chatmello plugin.
2. In WordPress, go to Plugins → Add New → Upload Plugin, choose the file, click Install Now, then Activate.
3. Go to Settings → Chatmello, pick a pet and click Connect Chatmello.
4. Log in to Chatmello, choose your site and click Connect. You're back in WordPress with your pet live.

Prefer code? Install a header and footer plugin such as WPCode and paste your snippet into its Footer box.

SShopify

Add it to your theme layout so it loads on every page of your store.

1. In Shopify admin, go to Online Store → Themes.
2. Next to your live theme, click ⋯ → Edit code.
3. Open layout/theme.liquid, paste your snippet just above </body>, and click Save.

WfWebflow

Site-wide custom code goes in the footer section.

1. Open Site settings → Custom code.
2. Paste your snippet into Footer code and click Save.
3. Publish your site. Custom code only runs on the published site, not in the Designer.

WxWix

Wix custom code needs a connected domain and a premium plan.

1. Go to Settings → Custom code → + Add custom code.
2. Paste your snippet, name it Chatmello, choose All pages and Load code on each new page.
3. Set Place code in to Body - end, then click Apply.

SqSquarespace

Code injection is available on Business plans and above.

1. Go to Settings → Advanced → Code injection.
2. Paste your snippet into Footer and click Save.

NReact / Next.js

Load it once in your root layout with Next.js's Script component.

1. Open your root layout (app/layout.tsx), or _app.tsx with the Pages Router.
2. Add the Script tag from this guide inside <body>.
3. Deploy. The pet appears on every page.

import Script from "next/script";

// inside <body>, after {children}
<Script src="https://www.chatmello.com/chatmello.js" data-site="YOUR-SITE-ID" strategy="afterInteractive" />

GGoogle Tag Manager

If your site already uses Tag Manager, no code changes are needed.

1. In Tag Manager, create a new tag of type Custom HTML.
2. Paste your snippet and set the trigger to All Pages (or Initialization - All Pages).
3. Click Submit to publish the container.

JavaScript API

Once the snippet has loaded, window.Chatmello lets your own code control the pet.

await Chatmello.ready;   // resolves when the pet is shown (or null)
Chatmello.open();        // open the chat, as if the pet was clicked
Chatmello.destroy();     // remove the pet and bring back your chat tool's button

Troubleshooting