Docly

Install Apex Reviews app to an unpublish Shopify theme

Estimated reading: 3 minutes 141 views

Follow this tutorial to install Apex Reviews app into an unpublished Shopify theme.

Requirement: Make sure that you have already installed Apex Reviews App into your Shopify store

In the next steps we will add the following code snippets :

I- Apex Reviews Global Settings

II- Apex Reviews Widget

III- Apex Reviews Product Star Rating

IV- Apex Reviews Collection Star Rating

I- Adding Apex Reviews Global Settings Snippet

1- Navigate to Online Store > Themes in your Shopify admin

Ekran Resmi 2022 11 10 15.02.02

First Go to Online Store/Themes

Choose the Unpublished  theme you want to  install Apex Reviews code snippets

2- Open Edit Code from Action Menu

Ekran Resmi 2022 11 10 15.02.20

Click on Action Menu

Select Edit Code

3- Open theme.liquid file in Layout folder and Paste the code below after the <head> tag

<script src=”https://app.apex-reviews.me/widgets/ApexCollectionBadges.js”></script>

Ekran Resmi 2022 11 10 15.18.27

Open product.liquid file in Templates folder

Paste the code above  here after the <head> tag

II- Adding Apex Reviews Widget Code Snippets

We will now add Apex Reviews widget codes into the Templates/product.liquid file to display reviews on your product page. 

Open product.liquid file in Templates folder and add Apex Reviews widget code below at the bottom of the page

{% render ‘apexreviews-widget’ , widget_type: ‘apex_products_reviews’ %}

Ekran Resmi 2022 11 10 16.55.50

Open product.liquid file in Templates folder

Add Apex Reviews widget code here at the bottom of the product liquid file

The reviews will be displayed at the bottom of your product page. You can change the location of the reviews by altering placement of the code snippet in the product.liquid file. 

III- Adding Star Rating in Product Pages

1- Open product-template.liquid or product-meta.liquid file in Sections folder depending on your theme

Ekran Resmi 2022 11 04 19.44.36

In Sections folder, click on product-template.liquid file

2- Copy and paste the following code below the code line including {{ product.title }}

<div class=”apex-reviews-badge”></div>

 
Ekran Resmi 2022 11 09 00.31.57

Find the code line containing { product.title }

And paste the code above here

IV- Adding Star Rating in collection pages

1- Locate and open one of the following code file depending on your theme

Since each themes has a different file name, please search for one of the following files: product-card-grid.liquid or product-card.liquid or product-grid-item.liquid or product-thumbnail.liquid or product-info.liquid file 

Ekran Resmi 2022 11 08 11.05.59

For example in Debut theme you need to select product-card-grid.liquid file

2- Copy and paste the following code below the code line containing {{ product.title }}

Please find the code line containing { product.title } and add the following code after it:  <div class=”apex_badge” data-product-id=”{{ product.id }}”></div>

Ekran Resmi 2022 11 08 12.05.09

Find the code line containing { product.title }

And paste the code above here

We hope this tutorial was helpful. If you need help please contact us.

Leave a Comment