How to Add Live Chat to Shopify (Step by Step)

One line in theme.liquid puts a live chat on every page of your Shopify store. Here's how to add it, verify your domain, and set it up for shoppers.

To add live chat to a Shopify store, paste the chat widget's code into your theme's layout/theme.liquid file, just before </body>. Every page of your online store then shows a chat button. It takes about five minutes and doesn't need an app from the Shopify App Store.

This guide uses SealReply as the example. It also covers the two things that trip up most Shopify stores: domains and checkout pages.

What you need

  • Access to your Shopify admin, with permission to edit themes.
  • Your store's own domain (for example shop.example.com) connected to Shopify. More on why in Step 4.
  • A free SealReply account. The free plan has no time limit.

Step 1: Add your store and copy the code

  1. Sign up. The console opens Set up your chat.
  2. Under Your website, enter a Site name and your store's domain as the Website address. Click Continue.
  3. On Install the widget, choose Shopify under Your website runs on, then click Copy.

The code looks like this:

<script src="https://cdn.sealreply.com/widget.js" data-site-key="sk_…" async></script>

Step 2: Paste it into theme.liquid

  1. In Shopify admin, go to Online Store → Themes.
  2. Next to your current theme, click … → Edit code.
  3. In the layout folder, open theme.liquid.
  4. Find </body> near the end of the file (press Ctrl+F or Cmd+F).
  5. Paste the code on the line just before it.
  6. Click Save.

The end of the file now looks like this:

    …
    <script src="https://cdn.sealreply.com/widget.js" data-site-key="sk_…" async></script>
  </body>
</html>

Two things to know:

  • Theme changes. The code lives in this theme. If you publish a different theme later, paste it into that theme's theme.liquid too.
  • Test on a copy first, if you like. Click … → Duplicate, edit the copy and preview it before you publish.

Step 3: Add your other store addresses

Shoppers may reach your store on several addresses: example.com, www.example.com, and the your-store.myshopify.com address Shopify gives every store. The widget only loads on the domains you allow.

In the console, open Sites → your store → Basics and list every address under Allowed domains, one per line. Keep your own domain first: the first one is the primary domain, the one you verify.

Step 4: Verify your domain

The widget stays hidden until you prove you own the primary domain. Shopify doesn't let you publish a file at your domain's root, so use the DNS option:

  1. In the console, copy the Name and Value of the TXT record under Domain verification.
  2. Add a TXT record with them where your domain's DNS is managed:
    • If you bought the domain through Shopify, go to Settings → Domains, open the domain, and find its DNS settings.
    • Otherwise, add it at your domain registrar or DNS host.
  3. Wait a few minutes, then click Check now.

That's why you need your own domain: you can't add DNS records to a .myshopify.com address. Once your own domain is verified, the .myshopify.com address works too, as long as it's in your allowed domains.

Step 5: Send a test chat

  1. On the setup page, click Open my website. Your store opens with the chat already open.
  2. Send a message as a shopper.
  3. Reply from the console.

Test chats don't count toward your monthly chats and are left out of reports.

What about the checkout page?

Shopify's checkout isn't part of your theme, so the code in theme.liquid doesn't run there. The chat shows on your home page, collections, product pages and cart — the places where shoppers ask most of their questions — but not during checkout.

If you'd rather keep a page quiet, for example an order status page, add it under Sites → your store → Page rules → Pages without the chat.

Set it up for shoppers

A store gets the same few questions again and again. Five settings answer them faster:

  1. Greetings by page. Under Page rules, add a greeting for pages whose address contains /products/, for example "Questions about sizing or delivery? Ask here."
  2. FAQ on the home page of the chat. Add shipping times, returns and payment methods, so shoppers find the answer before they ask.
  3. Quick replies. Save your answers to "Where is my order?" and "Do you ship to…?" and insert them by typing / in a chat.
  4. Wait-time reminder. If nobody answers in time, the chat offers to email the shopper the reply, so the question isn't lost. Find it under Hours & waiting.
  5. Leads. When a chat looks like a sale, set a follow-up date. You're told when that shopper comes back to the store.

If the chat doesn't appear

What the console says What to do
Not detected yet Check you saved theme.liquid in the published theme, not a draft copy.
Verify your domain first Finish Step 4. DNS can take a few minutes.
Loaded on a different domain The address you opened isn't in your allowed domains. Add it under Edit allowed domains.

Read more: How to never miss a customer when you're offline, and the general install guide for other platforms.