Due to the nature of Shopify, PowerReviews' Out-of-the-Box SEO (Option 1) is the only supported solution we offer for our clients who utilize Shopify as their eCommerce platform.
If you are using a third-party plugin for SEO, the following instructions may not apply. We recommend working with your Implementation Team or PowerReviews Technical Support for further guidance, if needed.
Adding the Subject Object Code
In order for PowerReviews to receive the Product Data to include in the JSON+LD markup we are generating, we require the production information to be passed in a specific way. This code is in addition to any Product Data code we are already receiving for Feedless.
The following is an example of a complete code block within a Shopify PDP, including the code necessary for SEO:
<!-- start_review_render_code_js_section -->
<script>
POWERREVIEWS.display.render({
api_key: <API KEY>,
locale: <LOCALE>,
merchant_group_id: <MERCHANT GROUP ID>,
merchant_id: <MERCHANT ID>",
page_id: "{{ product.id }",
review_wrapper_url:
"https://<STORE>.myshopify.com/pages/write-a-review/?pr_page_id={{ product.id }}",
product: {
name: "{{ product.title | escape | replace: "+", " " }}",
url: "https://powerreviews-seo.myshopify.com{{ product.url }}",
image_url: "https:{{ product.featured_image | product_img_url: "large" }}",
description: "{{ product.description | strip_html | strip_newlines | replace: "%0A",
"%20" | replace: '"', '%27' | escape }}",
category_name: {% if product.type != '' %}"{{ product.type }}"{% else %} "Default"{% endif %},
upc: "{{ product.barcode }}",
brand_name: "{{ product.vendor }}",
price: "{{ product.price | money_without_currency }}",
in_stock: "{{ product.available }}",
variants: [ {% for variant in product.variants %}
{% assign product_name = product.title %}
{% if product.variants.size > 1 %}{% assign product_name = variant.title %}{% endif %}
{
name: "{{ product.title | escape | replace: "+", " " }}",
description: "{{ product_name | escape }}",
page_id_variant: "{{variant.id}}",
upc: "{{ variant.barcode }}"
}{% if forloop.last == false %}, {% endif %} {% endfor %}
]},
subject: {
"@context": "https://schema.org",
"@type": "Product",
name: "{{ product.title | replace: "+", " " }}",
description: "{{ product.description | strip_html | strip_newlines | replace: "%0A",
"%20" | replace: '"', '%27' | escape }}",
offers: {
"@type": "Offer",
priceCurrency: "USD",
price: "{{ product.price | money_without_currency }}",
availability: "https://schema.org/InStock"
}
},
components: {
ReviewSnippet: "pr-reviewsnippet",
ReviewImageSnippet: "pr-imagesnippet",
ReviewDisplay: "pr-reviewdisplay"
}
});
</script>
<!-- end_review_render_code_js_section -->Removing Non-PowerReviews Product Schemas
Product schemas can be generated in different locations depending on your Shopify template(s), and the code itself may contain variations. For this reason we are not able to provide a specific location where you can find this, but below is some guidance to help you find this within the code of your page. Your actual code may vary from the examples, but should contain certain key elements.
JSON+LD
Outside of the PowerReviews code, look for an @context containing "schema.org" and an @type with the value "Product." The entire script section will need to be removed or commented out.
Example JSON+LD Product Schema:
<script type="application/ld+json">{
"@context": "http://schema.org/",
"@type": "Product",
"name": {{ product.title | json }},
"url": {{ shop.url | append: product.url | json }},
{%- assign media_size = product.featured_media.preview_image.width | append: 'x' -%} "image": [ {{ product.featured_media | img_url: media_size | prepend: "https:" | json }} ], {%- endif -%} "description": {{ product.description | strip_html | json }}, {%- if current_variant.sku != blank -%} "sku": {{ current_variant.sku | json }}, {%- endif -%} "brand": { "@type": "Thing", "name": {{ product.vendor | json }} }, "offers": [ {%- for variant in product.variants -%} { "@type" : "Offer", {%- if variant.sku != blank -%} "sku": {{ variant.sku | json }}, {%- endif -%} "availability" : "http://schema.org/{% if product.available %}InStock{% else %}OutOfStock{% endif %}", "price" : {{ variant.price | divided_by: 100.00 | json }}, "priceCurrency" : {{ cart.currency.iso_code | json }}, "url" : {{ shop.url | append: variant.url | json }} }{% unless forloop.last %},{% endunless %} {%- endfor -%} ] } </script>
Microdata
Some Shopify sites (typically older ones) will use the Microdata format for product schema instead of JSON+LD. With this, you will search for "schema.org/Product" within an itemtype property. The itemtype and itemscope properties should be removed or commented out so that there is just div with a class name. Without the product schema being declared, any metatags associated with the product schema should be ignored. Ideally, we would want to remove the metatags as well if they exist, but leaving them there should not impact the product schema.
Example Microdata Product Schema:
<div class="grid" itemscope itemtype="http://schema.org/Product">