Widget Setup — Install Your Free Chat Widget in One Minute — Fetchply

Install your free Fetchply AI chat widget on any website. Copy-paste script tag for HTML, WordPress, Shopify, React, and more. Floating or inline embed — your choice.

The floating widget adds a chat launcher to the corner of every page where the script is installed.

Copy your embed code

Open Dashboard → Agent → Embed and copy the script:

widget.js

<script
  src="https://fetchply.com/widget.js"
  data-chatbot-id="YOUR_CHATBOT_ID"
  defer
></script>

Add it to your website

Paste the snippet before </body> on each page where the widget should appear.

Add the script in your shared layout component so it loads on every page.

Add the snippet through your theme footer, site-wide script settings, or a header/footer plugin.

Add the script to your theme's theme.liquid file before </body>.

Test it

Refresh your page and click the chat launcher in the corner. Make sure everything looks right.

Script Settings

You can customize the widget directly from the script tag:

Setting	What It Does	Default
`data-chatbot-id`	Your agent ID (required)	—
`data-position`	`bottom-right` or `bottom-left`	`bottom-right`
`data-bubble-size`	Launcher size in pixels	`60`
`data-panel-width`	Chat panel width in pixels	`380`
`data-panel-height`	Chat panel height in pixels	`520`
`data-accent-color`	Override the accent color	—

Open the Chat From a Button

Turn any button or link on your site into a chat launcher — no coding needed.

Open the chat and send a message (great for buttons like "Track my order" or "Talk to sales"):

trigger-and-send.html

<button data-fetchply-message="I want to track my order">
  Track my order
</button>

Just open the chat so the visitor can type their own message:

trigger-open.html

<button data-fetchply-open>Chat with us</button>

This works on any clickable element — buttons, links, or anything else — as long as the widget script is on the same page.

Trigger From Your Own Code

If you prefer to control the widget with code, use the global FetchplyWidget command:

widget-api.js

// Open the chat and send a message
FetchplyWidget.open('How do I reset my password?');

// Open without sending — let the visitor type
FetchplyWidget.open();

// Close the chat
FetchplyWidget.close();

Button triggers and the FetchplyWidget command become ready once the widget finishes loading on the page (usually under a second).

Inline Iframe

Use an iframe when you want the chat embedded inside a page section instead of floating.

embed-iframe.html

<iframe
  src="https://fetchply.com/widget?chatbotId=YOUR_CHATBOT_ID"
  width="380"
  height="520"
  style="border: none; border-radius: 12px;"
></iframe>

Make sure your agent is enabled and has completed at least one training run before embedding. Disabled agents show an offline message.

Widget Setup — Install Your Free Chat Widget in One Minute

Floating Widget (Recommended)