Onsite Widget installation

Looking for the WhatsApp Bubble instead? Check out the WhatsApp Bubble installation guide.

The Onsite Widget is an AI Shopping Assistant that runs directly on your website. It provides:

Full chat experience with a modal or side-panel dialog
Product carousel with variant selection
Shopify cart integration for seamless add-to-cart functionality
Persistent conversations across page navigation
Customizable appearance with colors, banners, and positioning

You install it once, from the Shopify theme editor. After that, TextYess is the source of truth: every change you save in the dashboard goes live on your store automatically. You never paste or update code.

Switch on the TextYess app embed

In TextYess, open AI Agents → Onsite → Appearance and click Open Shopify Theme Editor. The theme editor opens with the TextYess app embed selected.Toggle TextYess on, then click Save.

You can also get there manually: in the Shopify theme editor, open App embeds from the left sidebar and toggle TextYess on.

This is the same app embed that powers the TextYess pop-up. One toggle installs both. Each one appears only when you switch it on in TextYess, so turning the app embed on never shows a widget you did not set up.

Switch the widget on for your store

In AI Agents → Onsite → Appearance, the first card is Store visibility. It shows whether the widget is Live or Hidden on your store, and whether the app embed is active in your theme.Turn the switch on. The widget appears on your storefront within a few seconds. Turn it off at any time to hide it again, with no theme edit.

Publishing your settings never changes store visibility. Only this switch does, so you can prepare the widget in full before shoppers see it.

Customize your widget in TextYess

In AI Agents → Onsite → Appearance you can customize:

Colors: background and bubble colors
Text: dialog title, welcome message, bubble text, and badge
Position: bottom-right corner or right-center of the screen
Display: centered modal or side panel
Banner image: a promotional image at the top of the chat
Popular questions: suggested questions for customers to ask

Click Save and refresh your storefront. The widget picks up your changes automatically — no theme edit needed.

Congratulations, you are live!

Already installed with a pasted code snippet?

Earlier versions of TextYess asked you to paste a code snippet into theme.liquid. If your store still has one:

Switch on the app embed (step 1 above).
Remove the old <textyess-ai-widget> snippet from your theme.

Your store never shows two widgets: while both the snippet and the app embed are present, only one renders. Pasted snippets also receive live updates now, so there is no rush — but removing the snippet keeps your theme clean. The Store visibility switch does not apply to a pasted snippet: it stays live with the styling written into its code, whatever the switch says. To control visibility from TextYess, move to the app embed and remove the snippet.

Custom trigger element

You can open the chat from your own button or link instead of (or in addition to) the default floating bubble. Set Custom trigger selector in AI Agents → Onsite → Appearance → Display to a CSS selector that matches your element, for example #ask-ai-btn or .open-chat. Any matching element opens the chat when clicked. You can also hide the default bubble from the same section.

Using the JavaScript API

For programmatic control, call methods directly on the widget element:

<script>
  // Wait for the widget to be ready, then call methods
  customElements.whenDefined('textyess-ai-widget').then(() => {
    const widget = document.querySelector('textyess-ai-widget');

    // Open the chat
    widget.open();

    // Close the chat
    widget.close();

    // Toggle open/closed
    widget.toggle();
  });
</script>

Get Started

Shopify

WooCommerce

Magento

Guides

TextYess MCP

Flows

Flows API

Orders API

Products API

Campaigns API

Analytics API

Onsite Widget installation

Already installed with a pasted code snippet?

Custom trigger element

Using the JavaScript API

​Already installed with a pasted code snippet?

​Custom trigger element

​Using the JavaScript API

Already installed with a pasted code snippet?

Custom trigger element

Using the JavaScript API