使用 Product Reviews 应用

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

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

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

  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.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. 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. 单击保存

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

注:如果您使用的是 Venture,则不建议对特色产品放置评分徽章。

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

  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. 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. 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-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. 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 进行销售了吗?

免费试用