General information
Our Product Review Widget is our main way of showing your reviews on your shop pages, either they were generated by your users through email/sms review requests, imported from other sellers, or migrated from different review applications. We offer six visually appealing ways of displaying them across your store.
What kind of reviews it shows :
The three different elements of content you can find in our main widget are photo/video reviews, just text reviews, and featured reviews showing a special tag to show the difference among the rest of them.
Where it should be used on the store :
The best place we suggest for the placement of this widget is on the product page template, so the reviews are visible for your customers below your product description, but this can be changed to another space to fit your visual needs.
Installation Instructions
Watch our video tutorial below to quickly add Opinew’s main review widget on your Shopify store’s product pages.
Method 1: App Blocks (Storefront 2.0)
What types of pages can the element be drag-and-dropped:
Product pages, home page, custom pages.
Watch App Blocks Tutorial Video
See the full help center article tutorial for App Blocks.
Method 2: Web Components
Using our new web components code, you can display the stars on collection pages, and product pages alike using the new code.
These lines of code need a block of code on the header of the theme, for more information on this matter please read the web components help guide.
1. Place the product review widget
Insert the code to indicate where you want the widget to show. It can be any type of html element but we recommend div or spanelement. It needs to have the required class and data attributes as described below.
To add it in a multiuse template:
<opinew-plugin type="product" product-id="{{product.id}}" domain="{{shop.permanent_domain}}"></opinew-plugin>To add it in pages knowing the product information:
<opinew-plugin type="product" product-id="123" domain="yourstore.myshopify.com"></opinew-plugin>Method 3: Shopify Liquid
<div style="clear:both;"></div><div id="opinew-reviews-product-page-code" class="">
<span id="opinew-plugin" data-server-address="https://www.opinew.com" data-opw-prodreviews="{{ product.metafields.opinew_metafields['product_plugin'] }}" data-opinew-shop-id="{{ shop.id }}" data-shop-url="{{shop.domain}}" data-platform-product-id="{{product.id}}">
<span id="opinew_product_plugin_app"></span>
</span></div>