1. Docs
  2. Install

Install on Shopify

Add the TalkingDot messenger to your Shopify store by pasting your snippet into your theme's theme.liquid layout. There's no app to install, and it takes about two minutes.

Before you start: copy your snippet from Settings → Install in your TalkingDot dashboard. It contains your workspace key and looks like this:

HTML
<script src="https://talkingdot.com/widget.js" data-key="YOUR_WORKSPACE_KEY" async></script>

Add the snippet to your theme

  1. Open the code editor. In your Shopify admin, go to Online Store → Themes. Next to your current theme, open the … (actions) menu and choose Edit code.
  2. Open theme.liquid. It's in the Layout folder in the file list.
  3. Find the closing </body> tag near the end of the file. Use Ctrl+F (⌘+F on a Mac) inside the editor to search for it.
  4. Paste your snippet on the line just above </body>, then click Save.
layout/theme.liquid
    {% section 'footer' %}

    <!-- TalkingDot messenger -->
    <script src="https://talkingdot.com/widget.js" data-key="YOUR_WORKSPACE_KEY" async></script>
  </body>
</html>

Your theme's last lines will differ from this example. All that matters is that the snippet sits just before </body>. Because theme.liquid wraps every storefront page, the messenger now appears across your whole store.

Theme updates and new themes: the snippet lives inside one theme. If you switch themes, or install an updated version of your theme (Shopify adds it as a new copy), paste the snippet into that theme's theme.liquid before you publish it.

Checkout pages

Shopify controls the checkout, so the messenger shows on your storefront pages: home, collections, products, cart, blog and other pages.

Optional: show logged-in customers' details

When a customer is signed in to your store, you can pass their name and email so your team knows who they're chatting with. Use this version instead of the plain snippet:

layout/theme.liquid
{% if customer %}
  <script>
    window.TalkingDotSettings = {
      email: {{ customer.email | json }},
      name: {{ customer.name | json }}
    };
    try { localStorage.setItem('talkingdot_shop', '1'); } catch (e) {}
  </script>
{% else %}
  <script>
    // Signed out since the last page? Start a fresh, anonymous messenger session.
    try {
      if (localStorage.getItem('talkingdot_shop')) {
        localStorage.removeItem('talkingdot_shop');
        window.TalkingDot = window.TalkingDot || function () { (TalkingDot.q = TalkingDot.q || []).push(arguments); };
        TalkingDot('shutdown');
      }
    } catch (e) {}
  </script>
{% endif %}
<script src="https://talkingdot.com/widget.js" data-key="YOUR_WORKSPACE_KEY" async></script>

A few limits apply:

  • These details are unverified. Identity verification needs a user_hash computed with your secret, and a theme can't keep a secret: anything in Liquid ends up readable in the page. Treat the name and email as labels, not proof of who's chatting.
  • That's why the example leaves out customer.id. An unverified user ID could be copied by someone else to open that customer's conversation history. Name and email only label the current visitor.
  • Leave Require identity verification off in Settings → Security. When it's on, unverified details are rejected and customers chat as anonymous visitors.
  • Need verified identities? That requires server-side code that knows the secret, such as a small endpoint behind a Shopify app proxy that returns the user_hash for the signed-in customer. This is custom development.

Verify it works

  1. Open your storefront in a private window. The launcher bubble appears in the bottom-right corner, or on whichever side you chose in Settings → Messenger.
  2. Send a test message. It appears in your TalkingDot Inbox.
  3. Check Settings → Install. It shows when the messenger was last seen on your store.

Troubleshooting

  • Password-protected store: while your store is behind a password page, only people who enter the password see the storefront and the messenger.
  • Domain allow-list: if you set one in Settings → Security, add your custom domain and your your-store.myshopify.com address. The messenger stays hidden on domains that aren't listed.
  • Edited the wrong theme: make sure you edited the theme marked as Current theme, not a draft copy.
  • Still nothing: open the browser console and look for TalkingDot: missing or invalid data-key. If you see it, copy the snippet again from Settings → Install.

Next steps

Last updated October 4, 2026 Something unclear? Tell us