FastComments.com

Add Comments to Squarespace Sites

使用 FastComments,我们可以轻松为任何 Squarespace 站点添加实时评论。

下面的说明分为三个部分,取决于您想要执行的操作:

  1. 向 Squarespace 博客文章添加评论
  2. 向所有页面添加评论
  3. 向特定页面添加评论

请注意,本教程需要一个 FastComments 帐户。建议您先注册,然后再回到此处。您可以在此创建帐户。


在博客中添加实时评论 Internal Link

在本节中,我们将学习如何将实时评论添加到您的 Squarespace 博客。

您只需要添加一次代码,组件将自动添加到任何现有的博客文章,以及任何 您将来创建的博客文章。

每篇博客文章的评论线程将是唯一的。

步骤 1:打开博客设置 Internal Link

我们将从编辑器左侧打开页面开始:

打开页面
打开页面

在底部你应该能看到 Blog,右侧有一个齿轮。点击齿轮以打开博客设置:

打开博客设置
打开博客设置

现在我们进入 Advanced 然后选择 Post Blog Item Code Injection

打开博客文章代码设置
打开博客文章代码设置

你应该会看到如下空白代码区域:

空白代码区域
空白代码区域

步骤 2:粘贴您的 FastComments.com 代码 Internal Link

现在我们可以复制以下代码片段(使用片段右上角的复制按钮):

Squarespace 博客评论代码
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5 (function () {
6 const tenantId = 'demo'; // 你的账户 ID
7
8 function tryLoad() {
9 // 尝试为不同布局加载
10 let targetDiv = document.querySelector('.blog-item-comments-content');
11 if (!targetDiv) {
12 targetDiv = document.getElementById('fastcomments-widget');
13 }
14 window.FastCommentsUI(targetDiv, {
15 tenantId
16 });
17 }
18
19 tryLoad();
20 })();
21</script>
22
23

...然后将其粘贴到代码区域并点击保存:

粘贴并保存
粘贴并保存

成功 Internal Link

成功!您现在应该在所有博客文章上看到 FastComments Comment Widget。

成功!
成功!

恭喜您已在 Squarespace 上设置 FastComments!如果您遇到 Domain Error,或想了解如何自定义评论区域,请继续阅读!


在所有页面添加实时评论 Internal Link

在本节中,我们将学习如何在您的 Squarespace 网站的所有页面上添加实时评论。

您只需添加一次代码,widget 将自动添加到任何现有页面,以及您将来创建的任何 页面。

评论线程在每个页面上都是唯一的。

步骤 1:打开开发者工具 Internal Link

我们将从在编辑器左侧打开设置开始:

打开设置
打开设置

在底部你应该能看到 Developer Tools。点击它:

打开开发者工具
打开开发者工具

现在我们进入 Code Injection:

打开代码注入
打开代码注入

现在你应该会看到两个可以添加代码的区域,一个标记为 HEADER,另一个标记为 FOOTER。我们将把代码添加到 FOOTER 区域:

空的页脚区域
空的页脚区域

在下一步,我们将复制代码并添加它。

步骤 2:粘贴您的 FastComments.com 代码 Internal Link

现在我们可以复制以下代码片段。使用出现在代码片段右上角的复制按钮。

代码中有一些可配置项,参见第 4 到第 7 行。

Squarespace 所有页面评论代码
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5 (function () {
6 const tenantId = 'demo'; // 你的帐户 ID
7
8 function tryLoad() {
9 // 尝试为不同布局加载
10 let targetDiv = document.querySelector('.blog-item-comments-content');
11 if (!targetDiv) {
12 targetDiv = document.getElementById('fastcomments-widget');
13 }
14 window.FastCommentsUI(targetDiv, {
15 tenantId
16 });
17 }
18
19 tryLoad();
20 })();
21</script>
22
23

...然后将代码粘贴到代码区域并点击保存。它应如下所示,代码位于 FOOTER 块:

粘贴并保存
粘贴并保存

如果遇到问题,请确保底部附近没有显示 "tenantId": "demo"。如果你已登录,应该显示你的 tenant id。如果没有,请联系支持。

成功 Internal Link


成功!现在您应该能在所有页面上看到 FastComments 评论小部件。

恭喜您已在 Squarespace 上设置 FastComments!如果您遇到域错误,或想了解如何自定义评论区域,请继续阅读!


在特定页面添加实时评论 Internal Link

在本节中,我们将学习如何将实时评论添加到您 Squarespace 网站的特定页面。

采用此方法,您需要将代码添加到想要放置评论小部件的每个页面。

评论线程将对每个页面唯一。

步骤 1:添加代码块 Internal Link

当将评论组件添加到某个特定页面时,我们会有更多的控制权。

我们可以将组件精确地添加到想要的位置,这正是我们将在本教程中通过添加自定义代码块来完成的。

首先,打开要添加评论的页面,然后点击左上角的 edit。

在此示例中,我们将专门为评论添加一个部分,但你也可以将它们添加到页面的现有部分 上。

让我们添加我们的部分:

添加部分
添加部分

我们将添加一个空白部分:

添加空白部分
添加空白部分

你会看到添加了一个很大的空白区域。点击左上角的 ADD BLOCK

添加模块
添加模块

向下滚动直到找到 Code 选项并点击它:

选择代码小部件
选择代码小部件

将你的代码块放置在希望评论组件出现的位置:

位置
位置

编辑代码块:

编辑代码块
编辑代码块

在下一步中我们将复制我们的代码并添加它。

步骤 2:粘贴您的 FastComments.com 代码 Internal Link

现在我们可以复制下面的代码片段。使用片段右上角出现的复制按钮。

有一些代码中的配置项,可查看第 4 到第 7 行。

Squarespace 单页面代码
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5 (function () {
6 const tenantId = 'demo'; // 你的账户 id
7
8 function tryLoad() {
9 window.FastCommentsUI(document.getElementById('fastcomments-widget'), {
10 tenantId
11 });
12 }
13
14 tryLoad();
15 })();
16</script>
17
18

应如下所示:

粘贴并保存
粘贴并保存

现在在右上角点击保存。

请注意,Preview in Safe Mode 选项将无法使用,但当你访问你的网站时,小部件会出现。

如果你遇到问题,请确认底部附近没有显示 "tenantId": "demo"。如果你已登录,它应显示你的租户 id。如果没有,请联系支持。

成功 Internal Link


成功!您现在应在页面上看到 FastComments 评论小部件。

恭喜您已在 Squarespace 上设置 FastComments!如果您遇到域错误,或想了解如何自定义评论区域,请继续阅读!


自定义 Internal Link

FastComments 旨在根据您的网站进行定制。

如果您想添加自定义样式或调整配置,请查看我们的自定义和配置文档以了解如何操作。