All Collections
Integrations
Shopify
Installing Widgets - Shopify 2.0
Installing Widgets - Shopify 2.0

Use App Embeds to install our widgets

Kai Jensen avatar
Written by Kai Jensen
Updated over a week ago

If you have a Shopify 2.0 Theme, you are able to use the App Embeds to drag and drop the widgets onto your site, without needing to know how to code.

Requirements

⭐️ Available on all of our plans

Navigation 📍

  • In REVIEWS.io, navigate to Integrations


Instructions ⚙️

There are two steps to getting the widgets installed on a 2.0 theme. The first is to enable the relevant app embeds, & then you will need to add this onto the theme.

Step 1: Enable App Embeds

Core Snippet

► The Core Snippet is required to make sure that the widgets work on your page. This provides all of the widgets with your Store ID to work as intended ⚙️

⚠️ Your store ID can be found on the Shopify Integrations page as shown below 👇

Navigate to your REVIEWS.io dashboard ▶️ Integrations ▶️ Shopify

As shown below, here you will find your Store ID. This will be unique to your Store and the below is just an example!

► Copy the code and press "Enable Core Snippet" this will direct you to your live Shopify theme, so you can enable this.

► If you are working on a draft theme, you can also find the Core Snippet by going to App Embeds within the Shopify theme customiser.

► You then need to enable the Core Snippet & enter your Store ID. This also allows you to set the language for your widgets. By default, your Store ID will be set to REVIEWS.io - this NEEDS to be changed to YOUR store ID!

You've completed the first step to displaying widgets on site and you'll now need to follow the next steps for specific widgets! 👇

Rating Snippet

Within the App Embeds section, you can enable the rating snippet ⭐️

🗣 Here you can define how the stars will show up on the page. You can change the colour, text, what happens when the customer clicks on the stars & if the rating is visible when there are no reviews for the product 🎨

Note: Setting the Rating Snippet to 'Show Empty Stars For No Reviews' is a great way to see how the Snippet will appear when placing it on your product page!

Floating Widget

The Floating widget will be installed globally across all pages on your site. Once you have enabled this, you will need to include your widget ID. To find this you can click the REVIEWS.io Dashboard link within Shopify. This will take you to the widget editor to allow you to make your desired style changes:

► After you have made your desired changes, you can press the save widget. Copy the widget ID value as highlighted in the above video, and paste this into the app block as shown below:

Note: If you make further changes to the widget, this will update on the live side provided you save existing changes and don't create a new version of the widget.

► If you want to hide the widget on certain pages, you can change the settings within the editor. If you want more control over which pages this shows on, it will require a manual install of the widget.

Here is the finished article! 🎉


Replays & Analytics

You will need to enable the Replays & Analytics app Embed.

► Click on this code and it'll take you to the REVIEWS.io dashboard, where you can copy the highlighted section from the screenshot below.

► After this navigate to your Shopify Settings and Checkout and scroll to Order Status Page & paste the code into the Additional scripts section.


Step 2: Adding Widgets

Rating Stars

Within the Product Page press Add block and select the Ratings Snippet you can then drag this wherever you'd like it to display within the product page.

Note: Rating Stars ⭐️ on collection pages requires a manual install!

Product Review Widget

► Press Add section and select the Product Reviews Widget, you can then drag the block to where you'd like to display this on the widget.

► If you click on the app, you will have style options that you can alter to customise the look and feel of the widget.

Note: We are limited by Shopify on how many options we can provide in the app block, if there is further customisation you want to do, it will require a manual install

Carousel Widget

► Press Add section and select the Card Carousel, you can then drag the block to where you'd like to display this on the widget.

► If you click on the app, you will have style options that you can alter to customise the look and feel of the widget.

Note: We are limited by Shopify on how many options we can provide in the app block, if there is further customisation you want to do, it will require a manual install


Nuggets, Rating Bar & UGC

To add the Nuggets Widget, please make sure you've enabled Nuggets on your dashboard by reading this article! 📝

► Add a new section, or block, and select which widget you'd like to use.

► Click on the block, and enter in the Widget ID. You can do this by clicking the REVIEWS.io Dashboard link. This will then open the Widget Editor as shown also above.

► You can then make any style changes to the widget and press save. This will open up the widget code where you can find the ID you need as seen below!

Note: Make sure you've selected your desired review type (Product/Company)

If you have any further questions please feel free to message us on our live chat service!

Did this answer your question?