Squarespace 的四档套餐里，能跑评论区的只有三档

能不能装得成，是套餐说了算

Squarespace 卖四档套餐，这篇文章的分水岭落在头两档之间。Basic 也给你 Code Block，可那个块只收纯文本、HTML、Markdown 和 CSS。把 <script> 标签放进去，什么都不会执行。站点级的 Header 和 Footer 两个格子，也就是 code injection，Basic 同样没有。

Squarespace 把这件事写在两处。价格对比表把 code injection 和高级代码块标成 Basic 不含、Core 与 Plus 与 Advanced 包含。帮助中心的说法一致：code injection 可用于 Core、Plus、Advanced 以及部分旧计费套餐；代码块里的 JavaScript 或 iframe 可用于 Core、Plus、Advanced，外加已经停售的 Business 和 Commerce 两个等级。

Business、Commerce Basic 和 Commerce Advanced 在那几篇帮助文档里还留着名字。它们是已经不再售卖的旧套餐。要是你的网站正好落在其中一档上，自定义代码你早就能用，下面的内容原样适用。

先看见评论区，再去动面板

两个面板，两件不同的事

Squarespace 把站点级的代码和页面内的代码分在两个地方管，这次安装两边各用一个。加载器得出现在任何可能冒出小部件的页面上，所以它进 Code Injection。挂载元素标的是评论区落脚的那一点，所以它以 Code Block 的形式进页面正文。

第一次装错，多半错在把这两样对调。把挂载用的 div 放进站点级的 Footer 格子，每个页面底部都会长出一个评论区，而且它们共用同一段对话。顺带交代一下本文的写法：Squarespace 的帮助中心和后台界面都不提供中文，能选的只有英语、德语、西班牙语、法语、意大利语、日语、韩语、荷兰语、葡萄牙语和土耳其语，所以这里的面板名一律保留英文原样。括号里写的不是标签，是那个格子做的事。

一个面板一个面板地装

1. squarespace.com 的初始网址也算一个域名

   Squarespace 的网站从建站那天起就带一个 something.squarespace.com 形式的初始网址，在你接上自有域名之前，它一直用这个网址应答。所以在试用站点上，或者在还没把正式域名指过来的改版里，地址栏上那个地址和你将来上线的地址并不是同一个。BootSignal 在加载评论区之前会拿 location.hostname 去比对登记在你 site id 名下的域名列表，因此这两个地址在控制台里是两条独立的记录，而不是一个网站的两个名字。先把现在这个地址加进去，等接上自有域名那天再加上它，等初始网址上什么都打不开了再把它删掉。控制台会把 site id 排在域名旁边，而这串字符是本文里唯一需要你从 BootSignal 抄过来的值。

2. 把加载器粘进 Code Injection

   在 Squarespace 后台依次打开 Website、Website Tools、Code Injection（站点级的代码格子）。标签放进 FOOTER 那一格，保存。Squarespace 会把这一格的内容注入到站内每个页面的闭合 body 标签之前。放 Header 那一格也能跑，放 Footer 则不会挡住首屏绘制。

   代码复制

   <script src="https://bootsignal.com/bootsignal.js"
           data-site-id="YOUR_SITE_ID" data-lang="zh-cn" defer></script>

3. 在评论区该在的位置放一个 Code Block

   把那个页面或博客文章切到编辑状态，把鼠标移到正文下方的版块上，点 Add block 或者 + 按钮，从区块菜单里挑 Code。点铅笔图标打开区块编辑器，把挂载元素粘进文本框。page-key 改成一个只属于这篇文章、以后也不会变的值，文章的 slug 就很合适。

   代码复制

   <div data-bootsignal="comments" data-thread-id="page-key"></div>

4. 关掉 Display Source，再 Apply 并保存

   区块编辑器里有一个 Display Source 开关（把源码当成文字显示出来）。开着，这段标记就被画成看得见的文字；关掉，它才会执行。这里要关掉。给区块点 Apply，然后保存页面。

5. 用无痕窗口验收

   在没有 Squarespace 登录会话的状态下打开公开网址。只有这一屏会告诉你实情，理由就写在后面两节里。

粘进去的代码变成文字，那是 Display Source

评论区该在的位置上直挺挺躺着一行尖括号，原因就是它，没有例外。Code Block 身兼两职：它可以执行你的标记，也可以把标记当成给读者看的代码示例画出来，走哪一条由 Display Source 决定。开着不管，Squarespace 就会老老实实把 <div data-bootsignal="comments"> 印给你的访客看。

这个开关不在站点设置里，而在区块编辑器内部，所以它一个区块一份。三个月后你新加的 Code Block 也带着自己的开关起步，能用同样的方式再坑你一次。确认它花两秒。从前台一路往回找原因，得搭进去半天，因为根本没有东西坏掉。

编辑界面不是判断成败的地方

Squarespace 对待登录会话和访客会话并不一样，而自定义代码正是两者分岔的地方。在你断定小部件坏了之前，有四件事得先知道。

• 登录状态下脚本经常不执行。Squarespace 写得很直白：出于安全考虑，有时候你登录时看不到自己的代码，尽管访客看得见。
• Code Block 的编辑器里有一个 Preview in Safe Mode 按钮（把嵌入的东西单独渲染一遍）。它至少能让你确认标记本身是完好的。
• 自定义代码要是把编辑器绊住了，你会看到 "We detected an error loading your site preview" 这条消息，还有一个 Disable Scripts in Preview 按钮（在编辑器里停掉自定义代码）。按下去，登录期间自定义代码就不再渲染，访客那边照旧。Squarespace 不建议在预览里把脚本重新打开，因为那会妨碍你编辑网站。
• 用一个没有 Squarespace 会话的无痕窗口打开公开网址，只有这一次确认能把问题了结。

订阅只有一份，区块以后想加几个都行

评论区不单卖。一个已登记域名是 每月 $20 或每年 $200，这一行就覆盖了整个目录：今天是 38 个付费小部件，旁边还有 33 个免费的浏览器工具，以及你订阅期间新上线的东西。这笔钱里没有哪一项在数页面浏览量或评论条数，所以意外传开的那篇文章和没人读的那篇文章付一样的钱。再多一个 Squarespace 网站就是再多一个域名，域名在同一个控制台里添加。

落到 Squarespace 上，这句话的意思是第二个小部件的代价只是多一个 Code Block。加载器已经在 Code Injection 里了，想在同一篇文章下面挂上评分，无非是在新区块里写一个 div。

这一类小部件里有不少反着来，所以下面两句要说出声。用户评价墙只用评分小部件真正收到的评价来砌墙，它压根没有编造引文的机制。社会认同提示只把你网站上已经存下的真实动静重放一遍，因此永远不会造出“俄亥俄州的某人刚刚买了这个”那种弹窗。

如果你还在挑，而不是已经决定装哪一个，托管式评论系统的带价对比收在备选方案汇总里。

一个月后才咬人的那些事

• 一篇文章一个 thread id，永远如此。两个 Code Block 共用同一个 data-thread-id，对话也就共用了。直接拿文章 slug 来命名，下一个来改站的人一眼就能看出规律。
• 要是为了间距或宽度在区块周围写 CSS，请写进 CSS Editor，别写进 Code Injection 的 header。Squarespace 提醒说 Ajax 页面加载会让注入的 CSS 失效，并且指明这种情况该用 CSS Editor。
• 一个 Code Block 最多装 400 KB，换成字符大约是 300,000 个。一行挂载元素离这个数还远得很，不过以后要往里粘更重的东西，天花板就在那儿。
• 只对 7.0 版网站成立：放在 Index 里的页面，它上面的代码可能不会渲染。Squarespace 给的绕行办法是把这个页面移出 Index，然后退出登录再看。
• 自定义代码在 Squarespace 的支持范围之外，他们也提醒平台更新可能会弄坏基于代码的定制。改完模板之后的那次检查，得你自己跑。

改版检查清单里可以加一个习惯：动过模板或版块之后，用无痕窗口打开一篇文章，确认评论区还在原处。版式一变，Squarespace 会挪动区块，而掉进隐藏版块里的 Code Block，会把评论一起带走。