使用 Product Reviews 应用

已于 Jan 28, 2022 打印了此页面。若要查看当前版本，请访问 https://help.shopify.com/zh-CN/manual/products/product-reviews/installation。

安装 Product Reviews 应用后，您可以将评论表单添加到产品页面，并查看产品和产品系列页面的评分徽章。

本教程的步骤将根据您的模板架构版本而有所不同。

点击您的模板架构版本的按钮，然后按照说明向在线商店中添加评论元素。

在您的 Online Store 2.0 模板中添加评论和评论表单

您可以将评论和评论表单应用块添加为产品模板上的分区，或添加为产品模板的主产品分区中的块。Shopify 模板商店中的所有 Online Store 2.0 模板都提供这些选项。您可以将评论和评论表单应用块添加到其他模板或分区，具体取决于您的模板。

将评论和评论表单添加为分区

  1. 在 Shopify 后台中，转到在线商店 > 模板。
  2. 找到您要编辑的模板，然后点击自定义。
  1. 在 Shopify 应用中，轻触商店。
  2. 在销售渠道部分，轻触在线商店。
  3. 轻触管理模板。
  4. 找到您要编辑的模板，然后轻触自定义。
  5. 轻触编辑。
  1. 在 Shopify 应用中，轻触商店。
  2. 在销售渠道部分，轻触在线商店。
  3. 轻触管理模板。
  4. 找到您要编辑的模板，然后轻触自定义。
  5. 轻触编辑。
  1. 导航到要向其中添加评论和评论表单分区的产品模板。
  2. 点击添加分区。
  3. 从下拉菜单中的应用分区，选择评论应用块。
  4. 可选：将应用分区移动到页面上的所需位置。
  5. 点击保存。

将评论和评论表单添加为块

  1. 在 Shopify 后台中，转到在线商店 > 模板。
  2. 找到您要编辑的模板，然后点击自定义。
  1. 在 Shopify 应用中，轻触商店。
  2. 在销售渠道部分，轻触在线商店。
  3. 轻触管理模板。
  4. 找到您要编辑的模板，然后轻触自定义。
  5. 轻触编辑。
  1. 在 Shopify 应用中，轻触商店。
  2. 在销售渠道部分，轻触在线商店。
  3. 轻触管理模板。
  4. 找到您要编辑的模板，然后轻触自定义。
  5. 轻触编辑。
  1. 导航到要向其中添加评论和评论表单块的页面和分区。
  2. 点击添加块。
  3. 从下拉菜单中的应用分区，选择评论应用块。
  4. 可选：将评论块移动到分区中的所需位置。
  5. 点击保存。

在您的 Online Store 2.0 模板中添加星级评分

您可以将星级评分添加为在产品模板的主要产品分区中的块。Shopify 模板商店中的所有 Online Store 2.0 模板都提供此选项。您可以将星级评分添加到其他模板和分区，具体取决于您的模板。

  1. 在 Shopify 后台中，转到在线商店 > 模板。
  2. 找到您要编辑的模板，然后点击自定义。
  1. 在 Shopify 应用中，轻触商店。
  2. 在销售渠道部分，轻触在线商店。
  3. 轻触管理模板。
  4. 找到您要编辑的模板，然后轻触自定义。
  5. 轻触编辑。
  1. 在 Shopify 应用中，轻触商店。
  2. 在销售渠道部分，轻触在线商店。
  3. 轻触管理模板。
  4. 找到您要编辑的模板，然后轻触自定义。
  5. 轻触编辑。
  1. 导航到要添加星级评分的页面和分区。
  2. 点击添加块。
  3. 从下拉菜单中的应用分区，选择星级评分应用块。
  4. 可选：将星级评分块移动到分区中的所需位置，或自定义星形颜色、尺寸、对齐方式和上下文。
  5. 点击保存。

在分区模板的产品页面中添加评论和评论表单

  1. 在 Shopify 后台中，转到在线商店 > 模板。

  2. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Shopify 应用中，轻触商店。

  2. 在销售渠道部分中，轻触在线商店。

  3. 轻触 Manage themes（管理模板）。

  4. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Shopify 应用中，轻触商店。

  2. 在销售渠道部分中，轻触在线商店。

  3. 轻触 Manage themes（管理模板）。

  4. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Sections 目录中打开 product-template.liquid。

  2. 在代码中找到您希望显示评论的区域。通常情况下，该区域在产品描述下方。若要在文件中查找产品说明，请搜索 {{ product.description }} Liquid 标签。

  3. 在包含 {{ product.description }} Liquid 标签的代码下粘贴以下片段：

<div id="shopify-product-reviews" data-id="{{product.id}}">{{ product.metafields.spr.reviews }}</div>

您的代码放置可能如下所示：

<div class="product-single__description rte" itemprop="description">
  {{ product.description }}
</div>

<div id="shopify-product-reviews" data-id="{{product.id}}">{{ product.metafields.spr.reviews }}</div>
  1. 单击保存。

在分区模板中将评分徽章添加到产品系列页面

  1. 在 Shopify 后台中，转到在线商店 > 模板。

  2. 找到要编辑的模板，然后点击操作 > 编辑代码。

  3. 在 Snippets 目录中，打开 product-grid-item.liquid 文件。

    在某些模板中，此文件具有不同的名称。如果您找不到 product-grid-item.liquid，请寻找以下某个名称：

- product-card-grid.liquid - product-card.liquid - product-card-item.liquid - product-block.liquid - product-item.liquid

  1. 在代码中找到希望显示评分徽章的区域。通常，该区域位于产品标题下方。若要在文件中查找产品标题，请搜索 {{ product.title }} Liquid 标签。

  2. 在包含 {{ product.title }} Liquid 标签的代码下的新行上，粘贴以下代码片段：

<span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>

您的代码放置可能如下所示：

<div class="grid-view-item{% unless product.available %} product-price--sold-out grid-view-item--sold-out{% endunless %}">
  <a class="grid-view-item__link" href="{{ product.url | within: collection }}">
    <img class="grid-view-item__image" src="{{ product.featured_image.src | img_url: grid_image_width, scale: grid_image_scale }}" alt="{{ product.featured_image.alt }}">
    <div class="h4 grid-view-item__title">{{ product.title }}</div>
      {% if section.settings.show_vendor %}
    <div class="grid-view-item__vendor">{{ product.vendor }}</div>
      {% endif %}
    <div class="grid-view-item__meta">
      {% include 'product-price' %}
    </div>
    <span class="shopify-product-reviews-badge" data-id="{{ product.id }}">
    </span>
  </a>
</div>

您可以尝试将代码放在文件的不同位置，以便确定您最喜欢的位置。

  1. 单击保存。

在分区模板的产品页面中添加评分徽章

要将评分徽章添加到您的产品页面，请执行以下操作：

  1. 在 Shopify 后台中，转到在线商店 > 模板。

  2. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Shopify 应用中，轻触商店。

  2. 在销售渠道部分中，轻触在线商店。

  3. 轻触 Manage themes（管理模板）。

  4. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Shopify 应用中，轻触商店。

  2. 在销售渠道部分中，轻触在线商店。

  3. 轻触 Manage themes（管理模板）。

  4. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Sections 目录中打开 product-template.liquid。

  2. 在代码中找到希望显示评分徽章的区域。通常，该区域位于产品标题下方。若要在文件中查找产品标题，请搜索 {{ product.title }} Liquid 标签。

  3. 在包含 {{ product.title }} Liquid 标签的代码下的新行上，粘贴以下代码片段：

<span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>

您的代码放置可能如下所示：

<h1 itemprop="name" class="product-single__title">{{ product.title }}</h1>

<span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>

您可以尝试将代码放在文件的不同位置，以便确定您最喜欢的位置。

  1. 单击保存。

在分区模板中为您的特色产品添加评分徽章

要为主页上的特色产品添加评分徽章，请执行以下操作：

  1. 在 Shopify 后台中，转到在线商店 > 模板。

  2. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Shopify 应用中，轻触商店。

  2. 在销售渠道部分中，轻触在线商店。

  3. 轻触 Manage themes（管理模板）。

  4. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Shopify 应用中，轻触商店。

  2. 在销售渠道部分中，轻触在线商店。

  3. 轻触 Manage themes（管理模板）。

  4. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Sections 目录中打开 featured-product.liquid 文件。

  2. 在片段中找到您希望评分徽章显示的区域。通常，该区域位于产品标题下方。若要在文件中查找产品标题，请搜索 {{ title }} Liquid 标签。如果找不到 {{ title }} 标签，请搜索 {{ product.title }} 标签。

  3. 在包含 {{ product.title }} Liquid 标签的代码下的新行上，粘贴以下代码片段：

<span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>

您的代码放置可能如下所示：

<div class="grid__item product-single__meta--wrapper medium--five-twelfths large--five-twelfths">
    {% if section.settings.show_vendor %}
      <h2 class="product-single__vendor" itemprop="brand">{{ vendor }}</h2>
    {% endif %}

    <h1 class="product-single__title" itemprop="name">{{ title }}</h1>

    <span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>

    <div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
      {% comment %}

您可以尝试将代码放在文件的不同位置，以便确定您最喜欢的位置。

  1. 单击保存。

在未分区模板的产品页面中添加评论和评论表单

要在产品页面中添加评论表单，请执行以下操作：

  1. 在 Shopify 后台中，转到在线商店 > 模板。

  2. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Shopify 应用中，轻触商店。

  2. 在销售渠道部分中，轻触在线商店。

  3. 轻触 Manage themes（管理模板）。

  4. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Shopify 应用中，轻触商店。

  2. 在销售渠道部分中，轻触在线商店。

  3. 轻触 Manage themes（管理模板）。

  4. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Templates 目录中，打开 product.liquid。

  2. 在代码中找到您希望显示评论的区域。通常情况下，该区域在产品描述下方。若要在文件中查找产品说明，请搜索 {{ product.description }} Liquid 标签。

  3. 在包含 {{ product.description }} Liquid 标签的代码下粘贴以下片段：

<div id="shopify-product-reviews" data-id="{{product.id}}">{{ product.metafields.spr.reviews }}</div>

您的代码放置可能如下所示：

<div class="product-single__description rte" itemprop="description">
  {{ product.description }}
</div>

<div id="shopify-product-reviews" data-id="{{product.id}}">{{ product.metafields.spr.reviews }}</div>
  1. 单击保存。

在未分区模板的产品系列页面中添加评分徽章

要将评分徽章添加到您的产品系列页面，请执行以下操作：

  1. 在 Shopify 后台中，转到在线商店 > 模板。

  2. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Shopify 应用中，轻触商店。

  2. 在销售渠道部分中，轻触在线商店。

  3. 轻触 Manage themes（管理模板）。

  4. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Shopify 应用中，轻触商店。

  2. 在销售渠道部分中，轻触在线商店。

  3. 轻触 Manage themes（管理模板）。

  4. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Snippets 目录中，打开 product-grid-item.liquid。

    在某些模板中，此文件具有不同的名称。如果您找不到 product-grid-item.liquid，请寻找以下某个名称：

- product-card.liquid - product-card-item.liquid - product-block.liquid

如果您的模板没有任何上述文件，那么您的产品网格代码可能会在 Templates 目录下的 collection.liquid 文件中。

  1. 在代码中找到希望显示评分徽章的区域。通常，该区域位于产品标题下方。若要在文件中查找产品标题，请搜索 {{ product.title }} Liquid 标签。

  2. 在包含 {{ product.title }} Liquid 标签的代码下的新行上，粘贴以下代码片段：

<span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>

您的代码放置可能如下所示：

<div class="grid-view-item{% unless product.available %} product-price--sold-out grid-view-item--sold-out{% endunless %}">
  <a class="grid-view-item_link" href="{{ product.url | within: collection }}">
    <img class="grid-view-itemimage" src="{{ product.featured_image.src | img_url: grid_image_width, scale: grid_image_scale }}" alt="{{ product.featured_image.alt }}">
    <div class="h4 grid-view-itemtitle">{{ product.title }}</div>
      {% if section.settings.show_vendor %}
    <div class="grid-view-itemvendor">{{ product.vendor }}</div>
      {% endif %}
    <div class="grid-view-item_meta">
      {% include 'product-price' %}
    </div>
    <span class="shopify-product-reviews-badge" data-id="{{ product.id }}">
    </span>
  </a>
</div>

您可以尝试将代码放在文件的不同位置，以便确定您最喜欢的位置。

  1. 单击保存。

在未分区模板的产品页面中添加评分徽章

要将评分徽章添加到您的产品页面，请执行以下操作：

  1. 在 Shopify 后台中，转到在线商店 > 模板。

  2. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Shopify 应用中，轻触商店。

  2. 在销售渠道部分中，轻触在线商店。

  3. 轻触 Manage themes（管理模板）。

  4. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Shopify 应用中，轻触商店。

  2. 在销售渠道部分中，轻触在线商店。

  3. 轻触 Manage themes（管理模板）。

  4. 找到要编辑的模板，然后点击操作 > 编辑代码。

  1. 在 Templates 目录中，打开 product.liquid。

  2. 在代码中找到希望显示评分徽章的区域。通常，该区域位于产品标题下方。若要在文件中查找产品标题，请搜索 {{ product.title }} Liquid 标签。

  3. 在包含 {{ product.title }} Liquid 标签的代码下的新行上，粘贴以下代码片段：

<span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>

您的代码放置可能如下所示：

<h1 itemprop="name" class="product-single__title">{{ product.title }}</h1>
<span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>

您可以尝试将代码放在文件的不同位置，以便确定您最喜欢的位置。

  1. 单击保存。

准备好开始使用 Shopify 进行销售了吗？

免费试用