Skip to content

How to add comments to a Shopify blog

Replace Shopify's blog comments with EchoThread. Edit sections/main-article.liquid in an Online Store 2.0 theme, key threads to article.id, and disable native comments.

10 min setup No dependencies
On this page

Why Shopify + EchoThread

Shopify's blog comments are flat, unthreaded, and moderated one at a time in the admin. There is no spam filtering, which is why a Shopify blog that leaves comments open usually fills with link spam, and why most merchants turn them off and lose the discussion instead.

Content marketing is the reason the blog exists, and comments are what turn a post into a reason to come back. EchoThread adds threaded replies, emoji reactions, ML spam filtering, and social sign-in — with no app subscription and no ads. The widget is under 60 KB gzipped, loads asynchronously from a CDN, and only ever loads on article pages.

Prerequisites

Register your domain first. In the dashboard, add your site's domain to the EchoThread site. Comments will display without it, but EchoThread only hands a completed sign-in back to a domain you have registered — so skipping this looks like "reading works, signing in doesn't".

Duplicate your live theme before editing (Online Store → Themes → ⋯ → Duplicate) and make the change on the copy. Preview it, then publish.

Step 1 — Edit the article section

Go to Online Store → Themes → ⋯ → Edit code. In an Online Store 2.0 theme such as Dawn, open sections/main-article.liquid. Search for 'new_comment' — that is Shopify's comment form, and it looks roughly like this:

sections/main-article.liquid (before) {%- if blog.comments_enabled? -%} <div class="article-template__comment-wrapper"> {%- form 'new_comment', article -%} ... {%- endform -%} </div> {%- endif -%}

Replace that whole block — from {%- if blog.comments_enabled? -%} through its {%- endif -%} — with the EchoThread container:

sections/main-article.liquid (after) <div class="article-template__comment-wrapper"> <div id="echothread" data-api-key="YOUR_API_KEY" data-page-url="{{ shop.url }}{{ article.url }}" data-identifier="shopify-{{ article.id }}" data-page-title="{{ article.title | escape }}"></div> <script src="https://cdn.echothread.io/widget.js" async></script> </div>

Replace YOUR_API_KEY with the public API key from your EchoThread dashboard. It is designed to live in page source — it only lets visitors read and post on your registered site.

Keep the theme's own wrapper class if your theme has one — article-template__comment-wrapper in Dawn. It is what constrains the comment area to the content column; drop it and the widget renders full-bleed.

Note the | escape filter on the title. Article titles routinely contain apostrophes, and the value is going into an HTML attribute.

If your theme is an older, non-2.0 one, the same block lives in templates/article.liquid instead. The edit is identical.

Step 2 — Disable native comments

Removing the form from the theme stops it rendering, but Shopify will still accept comments posted through other routes and still shows them in your admin. Turn the feature off properly: Content → Blog posts → Manage blogs, select your blog, and under Comments choose Comments are disabled.

Existing comments remain in your Shopify admin. Export them and use the importer in your EchoThread dashboard if you want them to carry across.

Choosing an identifier

The snippet keys each thread to shopify-{{ article.id }}. Article IDs are stable, so the discussion survives a handle change, a move to a different blog, or a change of storefront domain — all of which rewrite the URL.

The shopify- prefix keeps these identifiers distinct if the same EchoThread site also serves another platform.

Troubleshooting

I can't find the comment form in my theme

Search the whole theme for new_comment rather than browsing files. Some themes wrap it in a snippet such as snippets/article-comments.liquid and render it from the section.

Comments appear twice

You added the widget but left Shopify's form in place. Replace the {%- if blog.comments_enabled? -%} block rather than adding beside it, and disable comments in the admin.

The widget is full width

You dropped the theme's wrapper element. Keep the surrounding <div> with the theme's comment-wrapper class.

Sign-in opens and then does nothing

Register your storefront domain on the EchoThread site in the dashboard — and use your real domain, not the .myshopify.com address, if that is what customers see.

Frequently asked questions

What's wrong with Shopify's blog comments?

They are flat, unthreaded, and moderated one at a time in the Shopify admin. There are no replies, no reactions, and no spam filtering — which is why most Shopify blogs either leave comments off entirely or drown in link spam. EchoThread adds threading, reactions, and ML spam filtering without adding an app.

Do I need a Shopify app?

No. This is a theme edit — one block in one Liquid file. Nothing is installed, so there is no app subscription and nothing extra loading on your storefront.

Which file do I edit?

In an Online Store 2.0 theme such as Dawn, the article page is rendered by sections/main-article.liquid. Older themes may put the comment markup in templates/article.liquid instead. Search your theme for 'new_comment' and you will land on the right file either way.

Will this slow down my store?

No. The widget is under 60 KB gzipped, loads from a CDN with async, and only loads on blog article pages — never on a product or checkout page, which is where storefront speed actually matters.

Ready to add comments to your Shopify site?

Free for your first site. Set up in under 10 min.

Create free account