首页指南Shopify 博客的自带评论,没有回复这一层

Shopify 博客的自带评论,没有回复这一层

theme.liquid 里一行加载器,文章主分区里一个挂载元素,JSON 模板卡人的那一步也一并讲清楚。

更新

Shopify 本身就带着一套博客评论表单,连审核都替你准备好了,所以第一个该问的是:你到底还需不需要一个评论小部件。自带表单缺的是回复。Liquid 的 comment 对象里没有任何字段指向上一条评论,Shopify 的帮助文档也直接让商家装应用来做嵌套回复。如果你正是为这一点找过来的,那么托管式小部件只要一个脚本标签加一个挂载元素。真正让人卡住的不是代码,而是代码该进哪个文件。Online Store 2.0 主题的文章模板是 templates/article.json,而 Shopify 把话说得很死:"If you're using a JSON template, then any HTML or Liquid code needs to be included in a section",用了 JSON 模板,HTML 也好 Liquid 也好都得写进分区里。所以挂载元素的归宿是文章的主分区文件(Dawn 的话是 sections/main-article.liquid),不是那个 JSON。

自带评论表单能做什么,做不到什么

Shopify 的博客评论是按博客逐个开关的。后台进 内容(Content)> 博客文章(Blog posts),再点 Manage blogs(管理博客),挑一个博客,设置一共三档:评论已禁用允许评论,但需等待审核允许评论并自动发布。收到的每条评论各带一个状态,已批准未批准垃圾邮件,可疑的垃圾评论 Shopify 会自动标出来,而取消垃圾标记这个动作本身就等于批准。有两件事往往是后来才发现的:批准过的评论退不回未批准,删掉的评论也找不回来。

更硬的限制在结构上。主题用 {% form 'new_comment', article %} 画出表单,再遍历 article.comments 把已有评论铺开,而这个列表每页到 50 条就断。comment 对象交出来的字段是 author、content、created_at、email、id、status、updated_at、url。没有哪个字段能说明这条评论是回给哪一条的,所以哪怕你自己写 Liquid,回复也画不出来。

行为Shopify 自带评论BootSignal 评论小部件
回复某一条评论没有(comment 对象没有父级字段)支持嵌套回复
作者是谁表单里手填的姓名和邮箱Google 登录,所有 BootSignal 小部件通用
数据存在哪里你自己的 Shopify 店铺BootSignal,绑定你注册的域名
管理方式Shopify 后台,三种状态,垃圾评论自动标记BootSignal 控制台,删评论或者封作者
删掉一条评论只能删除,删了找不回在控制台里删除
分页article.comments 每页 50 条小部件自己处理
要装的东西主题里本来就有一个加载器加一个挂载元素
自带评论的行为取自本文末尾列出的 Shopify 帮助中心和 shopify.dev 文档,查阅日期是 2026-08-25。

一个月才收到一条评论的店铺,留着自带表单反而省事。值得换的是另一种情形:读者开始在文章底下互相搭话,而不是各写各的单向留言。

先看清楚你的主题用的是哪种文章模板

Shopify 上真正的关口是这个,跟你付多少钱没关系。复制任何代码之前先确认,因为它决定你要打开哪个文件。进 编辑代码(Edit code)界面,展开 模板(Templates)文件夹,找文章模板。顺带说一句:Shopify 的简体中文后台把「主题」一律叫作「模板」,所以文件树里那个 模板 文件夹指的是 templates 目录,而菜单里的 模板 指的是主题本身。看到 templates/article.liquid 就是 vintage 主题,HTML 和 Liquid 可以直接写进那个文件。看到 templates/article.json 就是 Online Store 2.0 或 Horizon 世代的主题,现在多数店铺都在这一边。

JSON 模板装的是分区和设置的清单,不是标记。往里塞一个 <div>,JSON 就坏了,保存直接报错,而大部分人正是在这一步收手,然后得出 Shopify 装不了小部件的结论。JSON 主题要动的地方是文章的主分区:打开 分区(Sections)文件夹,找到那个模板引用的分区文件。Dawn 的话就是 sections/main-article.liquid

哪些店铺装得上,哪些装不上

没有需要升级的套餐。Shopify 在文档里介绍代码编辑器、模板编辑器、Custom Liquid 分区和应用嵌入块(App embeds)时,都没有附加任何套餐条件;Basic 套餐页面写着它包含一个可以改的在线商店,以及一个会收评论的内置博客功能。Basic 往上,故事就这些。不过 Shopify 目前列出的九个套餐里有四个在这个故事之外,原因分两路。

Lite 和 Agentic 根本没有可以安装的地面。Lite 套餐页面写明这个套餐不包含在线商店销售渠道,Agentic 套餐页面则把 Online Store 排在「本套餐不提供」的功能列表第一行。没有在线商店就没有主题、没有博客,也没有地方安放一串对话,所以这不算被挡住,而是话题本身不成立。

Starter 和 Retail 共用另一种限制。两者都只让你用 Spotlight 一个主题,都写着其他主题和更多自定义选项不提供,而代码编辑器进不进得去,两个页面谁都没说。所以既不是能也不是不能,先记成未确认,与其推演不如自己在店铺里点一下 编辑代码(Edit code)。这两个套餐也都不再接受新注册。Starter 页面的原话是 "The Starter plan isn't available to new stores.",Retail 页面对 Retail 也有同样一句。现在还在用其中之一,那是因为你本来就在用。

读者会看到的评论区长这样

预览

2 条评论

添加评论…
以 Alex 身份评论发布
  • M
    Maya2 小时前

    真的一行就搞定了,没想到安装这么简单!

  • J
    Jordan昨天

    连登录都是共享的,不用再额外接入。👍

用样例评论画出来的预览。放到 Shopify 博客文章下面,它会照主题的正文宽度铺开,样子一样。

加载器和挂载元素,各回各的位置

  1. 地址栏里显示的那个地址才是要登记的

    候选只有两个。.myshopify.com 地址在店铺创建时发下来,之后一直跟着它;后来接上的自定义域名才是顾客真正输入的那个。博客文章由哪一边送出,取决于你的域名设置走到了哪一步,还没接自定义域名的店铺,一切都从 myshopify 地址出去。小部件是拿 location.hostname 去对 site id 名下登记的域名列表,所以打开一篇真实文章时地址栏里是什么,就登记什么;正在切换、或者习惯用 myshopify 地址验收的话,两个都登记。登记在 BootSignal 控制台 做,回给你的就是 site id。进到 Shopify 主题里的 BootSignal 值只有这一串。

  2. 先复制一份主题,再打开代码编辑器

    Shopify 后台进 在线商店(Online Store),找到主题,点那个横向菜单("...")图标,选 编辑代码(Edit code)。手机上的路径是 菜单图标 > 销售渠道(Sales channels)> 在线商店 > 管理模板(Manage themes)> 横向菜单图标 > 编辑代码。动手之前先把主题复制一份:主题更新有可能把代码改动一起带走,手里留个能退回去的副本更稳。

  3. 把加载器放进 theme.liquid

    在文件树里展开 布局(Layout)文件夹,选 theme.liquid。加载器粘在闭合的 </body> 标签前面,点 保存(Save)。标签上的 defer 别去掉:Shopify 的 Theme Check 把阻塞解析的脚本列为拖慢店铺的原因,带 defer 的标签不会占住渲染。BootSignal 其余小部件也都靠这一个标签起来,以后再加评分块或者公告横幅,店铺前台不会因此多一个脚本文件。

    代码
    <script src="https://bootsignal.com/bootsignal.js"
            data-site-id="YOUR_SITE_ID" data-lang="zh-cn" defer></script>
  4. 在文章的主分区里加挂载元素

    JSON 主题就打开 分区(Sections)文件夹,编辑文章的主分区文件(Dawn 的话是 sections/main-article.liquid)。挂载元素放在正文之后,通常就是自带评论块原来待的位置。vintage 主题则放到 templates/article.liquid 的同一处。把 data-thread-id 绑到文章上,一篇文章就有一条属于自己的评论串。

    代码
    <div data-bootsignal="comments" data-thread-id="{{ article.handle }}"></div>
  5. 保存,然后去看一篇已经发布的文章

    存好分区文件,在普通浏览器标签页里打开一个真实的博客文章地址。评论区会出现在正文下方,第一个用 Google 登录的访客就能写。什么都没出现的话,先读地址栏里的主机名,再回控制台核对域名清单,因为小部件自己跑的正是这一条核对。

挂载元素为什么不能放进 theme.liquid

theme.liquid 是全站布局。加载器该待在那里,正因为它本来就该到处运行;挂载元素完全是另一回事,粘进布局,你的商品页、购物车、政策页和首页就会各自多出一个空评论框。商家常这么干,然后纳闷结账按钮底下怎么会有一个评论框。

要是文章分区实在够不着(主题被锁,或者结构古怪),就把挂载元素包在模板条件里,只让它在博客文章上渲染。

实在没有别的办法时才这么写
{% if template contains 0 %}
  <div data-bootsignal="comments" data-thread-id="{{ article.handle }}"></div>
{% endif %}

能用,但它把博客的标记塞进了全店每个页面都要加载的文件。分区文件才是它该住的地方。

不开代码编辑器的 Custom Liquid 路线

确实有一条不写代码的路。打开模板编辑器(入口是 在线商店 > 自定义),用顶栏中间的模板下拉菜单切到博客文章模板,然后在左侧的分区列表里点 Add section(新增一个分区),要放进已有分区就点 Add block(新增一个区块),选 Custom Liquid(作用是让你直接粘 HTML 的那个分区)。把挂载元素粘进代码栏保存就行。Shopify 的 Theme Store 要求上架主题必须带这个分区,并把 Custom Liquid 区块描述成应用的插入点,所以大多数商家手里都有。

  • liquid 设置项的内容上限是 50kb,小部件的代码段离这个数差得远。
  • 写坏的 Liquid 保存时会报错,而没闭合的 HTML 标签会被自动补上,粘得潦草的话结构会被悄悄挪动。代码段要粘完整。
  • 这个设置项用不了 {% javascript %}{% stylesheet %} 标签,所以只有「普通 HTML 加一个 <script src>」这种形状能活下来。
  • 自建主题、非市场主题或者老的 vintage 主题,可能压根没有 Custom Liquid。那就只剩代码编辑器一条路。

把自带表单关掉,不然你会同时开着两个

小部件上线之后,主题还在它下面继续画 Shopify 自己的评论表单。到 内容(Content)> 博客文章(Blog posts)> Manage blogs(管理博客),挑中那个博客,把设置改成 评论已禁用。表单会从主题上消失,你一行代码都不用碰。

关掉之前先把想留的内容抄出来,而且要抄到 Shopify 之外。已删除的评论无法恢复,自带评论表和小部件之间也没有迁移通道,所以旧的那串和新的那串从一开始就是两件东西。

换掉自带的评论表单

嵌套回复、Google 登录,审核在自己的控制台里做。

价钱,以及流量为什么不影响它

一份订阅覆盖这条评论串,也覆盖你以后想挂在它旁边的一切:每个已注册域名每月 $20 或每年 $200,不按浏览量或访客数计。这一点在店铺博客上比在个人网站上更要紧,因为一篇选购指南被折扣站抓走,流量能一夜翻几倍,账单却不动。第二家店就是第二个域名,在控制台里加。目录现在是 38 个付费小部件加 33 个免费浏览器工具,你订阅之后新增的小部件也一并包含(完整价格)。跟其他评论工具的带价对比放在对比区

订阅万一断掉,评论串不会从你的博客上消失。评论照常可见,只是变成只读,什么都不会被删除,续上订阅之后一切照旧。要在一个准备用好几年的店铺上装东西,这件事值得先知道。

同一篇文章里再放一个星级评分

你粘进 theme.liquid 的那个加载器带得动其余全部小部件,所以第二个小部件的代价只是同一个分区文件里多一个 div。在店铺博客上,评分是真出力的:一篇底下带分数的选购指南,读起来和不带分数的不是一回事。

预览
★★★★ 4.2 · 36 条评价
★★★★★

五分钟搞定,界面也很干净。

Sam

评分与评价,挂载方式和评论串一样,也是靠 data-thread-id 分辨页面。

这里收到的评价还会喂给用户评价墙小部件,而它只能展示别人真的留下的话。它没有编造的能力,这在一个电商站上很重要:看起来像假的社会认同,赔掉的是订单。

每次主题更新之后回去看一眼那篇文章

这是没人提前告诉你的维护项。Shopify 说得很清楚:如果你对主题代码所做的改动与主题更新不兼容,那么在更新后的副本里,你做的全部代码改动都会被删掉。你的加载器和挂载元素就是代码改动。它们可能在一次你为了完全无关的理由批准的更新里消失,而且没有任何提示,因为少了一个评论区并不会让页面报错。

  1. 更新之前先复制当前主题,让正在工作的这一套以副本形式留下来。
  2. 更新发布之后,打开一篇博客文章,确认评论区还在。
  3. 不在了就重新进 编辑代码(Edit code),两段各粘回去:加载器进 theme.liquid,挂载元素进文章分区。
  4. 评论内容本身没有风险。它们存在 BootSignal 这边,按 thread id 归档,粘回去整串评论就原样回来。

把这件事记在你平时记录店铺改动的地方,和其他主题定制项放在一起。更新后花两分钟,好过一个月之后由顾客告诉你,最受欢迎那篇文章底下的讨论早就不见了。

常见问题

我用的是 Starter 套餐,能装吗?
有可能不行,而 Shopify 没把话说明。Starter 只让你用 Spotlight 一个主题,并写着其他主题和自定义选项不提供,却没交代代码编辑器进不进得去,所以先在自己店铺里点一下 编辑代码,再据此安排。Retail 带着同样的限制。另有两个套餐是干脆的不行,理由不同:Lite 不包含在线商店销售渠道,Agentic 的不提供功能列表里第一个就是 Online Store,两者都没有博客来承载评论串。Basic 及以上没有要升的东西,因为 Shopify 介绍代码编辑器、模板编辑器和 Custom Liquid 分区时都没有附套餐条件。另外还有一条跟套餐无关:付费主题得先买下来,代码才编辑得了。
可以把小部件代码粘进 templates/article.json 吗?
不行。Shopify 写明,用了 JSON 模板的话,任何 HTML 或 Liquid 代码都必须写进一个分区里。JSON 模板装的是分区和设置,标记粘进去文件就坏了。改文章的主分区文件(Dawn 的话是 sections/main-article.liquid),或者在模板编辑器里给博客文章模板加一个 Custom Liquid 分区。
在模板编辑器里看,评论区的样子不对,是不是装坏了?
多半没坏。那个预览是从你自己的店铺域名渲染出来的,不是第三方沙箱,所以评论区的标记会照常出现。判断不了的是行为:编辑器会在分区内容上覆盖一层选中框和它自己的点击拦截,在那个框里试 Google 登录,成不成都说明不了什么。存好文件,用一个普通标签页打开已发布的博客文章。只有那一屏说的是实话,也正是顾客看到的那一屏。
留言的人需要 Shopify 顾客账户吗?
不需要。小部件用 Google 让人登录,身份留在 BootSignal 这边,所以你的 Shopify 顾客名单里不会多写一条记录,也没人为了回一篇文章去注册店铺账号。你域名上的每个 BootSignal 小部件共用这一次 Google 登录。
我改了博客文章的 handle,评论串变空了,评论去哪了?
哪也没去。挂载元素是按 data-thread-id 找评论串的,{{ article.handle }} 在你改完之后解析成新的 handle,于是小部件去查一条从没写过东西的串。改标题不会有这个后果,只有改 handle 才会。把旧 handle 改回去,或者把旧值直接写死在 data-thread-id 里而不用 Liquid 变量,原来的评论就回来了。
能不能保留 Shopify 自带评论,同时再加一个小部件?
可以,但访客会看到两个评论表单,碰上哪个答哪个,对话被劈成两套系统。小部件上线之后,到 内容 > 博客文章 > Manage blogs 把博客设成 评论已禁用。动手前先把值得留的内容另存一份,已删除的评论无法恢复。
给我的 Shopify 博客加上评论

先登记店铺域名,再把一行加载器粘进 theme.liquid。

数据来源