De Product Reviews-app gebruiken

Nadat u de Product Reviews-app heeft geïnstalleerd, kunt u beoordelingsformulieren aan uw beoordelingsscorebadges aan uw product- en collectiepagina's toevoegen.

De stappen in deze zelfstudie verschillen al naar gelang of u een thema met secties of zonder secties gebruikt. Een thema met secties is een nieuwer thema waarin u kun slepen en neerzetten om de pagina-opmaak van uw winkel te bepalen.

Ga naar de pagina Code bewerken van uw thema om erachter te komen of uw thema secties ondersteunt. Als de directory Secties bestanden bevat, gebruikt u een thema met secties. Thema's zonder secties werden gebruikt voor oktober 2016 en de directory Secties van deze thema's bevat geen bestanden.

Als u een sectiethema gebruikt, klikt u op de knop Sectiethema's en volgt u de instructies. Als u een ouder, niet-gesegmenteerd thema gebruikt, klikt u op de knop Thema's zonder secties en volgt u de instructies.

Beoordelingen en een beoordelingsformulier aan uw productpagina toevoegen in thema's met secties

Beoordelingsformulieren aan uw productpagina's toevoegen:

  1. Open product-template.liquid in de directory Secties.

  2. Zoek in de code het gebied op waar u uw beoordelingen wilt weergeven. Meestal is dit onder de productbeschrijving. Zoek de productbeschrijving in het bestand op door naar de Liquid-tag {{ product.description }} te zoeken.

  3. Onder de code die de Liquid-tag {{ product.description }} bevat, plakt u het volgende fragment:

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

De code ziet er dan ongeveer zo uit:

<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. Klik op Opslaan.

Beoordelingsscorebadges aan uw collectiepagina's toevoegen in thema's met secties

Stappen:

  1. Ga in de Shopify-beheerder naar Online winkel > Thema's.

  2. Zoek het thema dat u wilt bewerken en klik vervolgens op Acties > Code bewerken.

  3. Open product-grid-item.liquid in de directory Fragmenten.

    In sommige thema's heeft dit bestand een andere naam. Als u product-grid-item.liquid niet kunt vinden, zoekt u naar een van de volgende bestanden:

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

  1. Zoek in de code het gebied op waar u uw beoordelingsscorebadges wilt weergeven. Meestal is dit ergens onder de producttitel. Zoek de producttitel in het bestand op door naar de Liquid-tag {{ product.title }} te zoeken.

  2. Op een nieuwe regel onder de code die de Liquid-tag {{ product.title }} bevat, plakt u het volgende fragment:

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

De code ziet er dan ongeveer zo uit:

<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>

U kunt experimenteren met het plaatsen van de code op verschillende plaatsen in het bestand om te bepalen welke locatie u het meest bevalt.

  1. Klik op Opslaan.

Beoordelingsscorebadges aan uw productpagina toevoegen in thema's met secties

Beoordelingsscorebadges aan uw productpagina's toevoegen:

  1. Open product-template.liquid in de directory Secties.

  2. Zoek in de code het gebied op waar u uw beoordelingsscorebadges wilt weergeven. Meestal is dit net onder de producttitel. Zoek de producttitel in het bestand op door naar de Liquid-tag {{ product.title }} te zoeken.

  3. Op een nieuwe regel onder de code die de Liquid-tag {{ product.title }} bevat, plakt u het volgende fragment:

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

De code ziet er dan ongeveer zo uit:

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

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

U kunt experimenteren met het plaatsen van de code op verschillende plaatsen in het bestand om te bepalen welke locatie u het meest bevalt.

  1. Klik op Opslaan.

Beoordelingsscorebadges aan uw uitgelichte product toevoegen in thema's met secties

Beoordelingsscorebadges aan uw uitgelichte product op de homepage toevoegen:

  1. Opent het bestand featured-product.liquid in de directory Secties.

  2. Zoek in het fragment het gebied op waar u uw beoordelingsscorebadges wilt weergeven. Meestal is dit ergens onder de producttitel. Zoek de productitel in het bestand op door naar de Liquid-tag {{ title }} te zoeken. Als u de tag {{ title }} niet kunt vinden, zoekt u naar de tag {{ product.title }}.

  3. Op een nieuwe regel onder de code die de Liquid-tag {{ product.title }} bevat, plakt u het volgende fragment:

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

De code ziet er dan ongeveer zo uit:

<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 %}

U kunt experimenteren met het plaatsen van de code op verschillende plaatsen in het bestand om te bepalen welke locatie u het meest bevalt.

  1. Klik op Opslaan.

Beoordelingen en een beoordelingsformulier aan uw productpagina toevoegen in thema's zonder secties

Beoordelingsformulieren aan uw productpagina's toevoegen:

  1. Open product.liquid in de directory Sjablonen.

  2. Zoek in de code het gebied op waar u uw beoordelingen wilt weergeven. Meestal is dit onder de productbeschrijving. Zoek de productbeschrijving in het bestand op door naar de Liquid-tag {{ product.description }} te zoeken.

  3. Onder de code die de Liquid-tag {{ product.description }} bevat, plakt u het volgende fragment:

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

De code ziet er dan ongeveer zo uit:

<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. Klik op Opslaan.

Beoordelingsscorebadges aan uw collectiepagina's toevoegen in thema's zonder secties

Beoordelingsscorebadges aan uw collectiepagina's toevoegen:

  1. Open product-grid-item.liquid in de directory Fragmenten.

    In sommige thema's heeft dit bestand een andere naam. Als u product-grid-item.liquid niet kunt vinden, zoekt u naar een van de volgende bestanden:

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

Als uw thema geen van de bovenstaande bestanden bevat, kunt u de productrastercode mogelijk vinden in het bestand collection.liquid in de map Sjablonen.

  1. Zoek in de code het gebied op waar u uw beoordelingsscorebadges wilt weergeven. Meestal is dit ergens onder de producttitel. Zoek de producttitel in het bestand op door naar de Liquid-tag {{ product.title }} te zoeken.

  2. Op een nieuwe regel onder de code die de Liquid-tag {{ product.title }} bevat, plakt u het volgende fragment:

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

De code ziet er dan ongeveer zo uit:

<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>

U kunt experimenteren met het plaatsen van de code op verschillende plaatsen in het bestand om te bepalen welke locatie u het meest bevalt.

  1. Klik op Opslaan.

Beoordelingsscorebadges aan uw productpagina toevoegen in thema's zonder secties

Beoordelingsscorebadges aan uw productpagina's toevoegen:

  1. Open product.liquid in de directory Sjablonen.

  2. Zoek in de code het gebied op waar u uw beoordelingsscorebadges wilt weergeven. Meestal is dit net onder de producttitel. Zoek de producttitel in het bestand op door naar de Liquid-tag {{ product.title }} te zoeken.

  3. Op een nieuwe regel onder de code die de Liquid-tag {{ product.title }} bevat, plakt u het volgende fragment:

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

De code ziet er dan ongeveer zo uit:

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

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

U kunt experimenteren met het plaatsen van de code op verschillende plaatsen in het bestand om te bepalen welke locatie u het meest bevalt.

  1. Klik op Opslaan.

Klaar om te beginnen met verkopen met Shopify?

Probeer het gratis