Skip to main content
All CollectionsShopifyInstall & Upgrade
Show star ratings on your Shopify collection page
Show star ratings on your Shopify collection page

This article will show you how to show star ratings on the Shopify collection page.

Yen Ma avatar
Written by Yen Ma
Updated over a week ago

Using the Ryviu app, you can boost customer trust by showcasing star ratings on your Shopify collection page. Follow these step-by-step instructions to integrate this feature.

Please enable Ryviu app in App embeds tab of theme settings to make it work properly.

For themes with Ryviu integration

Ryviu is integrated into the themes Kalles, Debutify, Gecko, Basel, Elessi, Hooli, and Minimog. If you're using these themes, please access the theme settings and select product review app is Ryviu to make star ratings and reviews widgets will be displayed on your store.

For themes without Ryviu integration

Here are the steps to add the code snippet to display the rating star on the collection page.

πŸ‘‰ Step 1. Access Theme Code

  • Navigate to Online Store > Themes in your Shopify admin.

  • Select your theme and click ... > Edit Code.

πŸ‘‰ Step 2. Insert Ryviu Code

The following steps could vary depending on the theme you've chosen.

Theme

Installation steps

Athens

Be Yours

Chord

Colorblock

Craft

Crave

Dawn

Eurus

Launch

Origin

Publisher

Ride

Refresh

Sense

Spotlight

Studio

Taste

Viola

  • Open card-product.liquid file.

  • Above the line that includes {%- if show_rating , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{card_product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{card_product.id}}" handle="{{card_product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Tema Aurora

Tema Warehouse

  • Open product-item.liquid file.

  • Above the line that includes {%- if settings.show_reviews_badge -%} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Debut

  • Open product-card-grid.liquid file.

  • Under the line that includes {{ product.title }} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Turbo

Turbo-portland

  • Open product-info.liquid file.

  • Under the line that includes {{ product.title }} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Empire

  • Open product-grid-item.liquid file.

  • Under the line that includes </h2> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Prestige

Xtra

  • Open product-item.liquid file.

  • Above the line that includes {%- if settings.show_product_rating -%} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Baseline

Creative

District

Expanse

Fetch

Flow

Impulse

Label

Motion

North

Streamline

Sydney

  • Open product-grid-item.liquid file.

  • Under the line that includes {{ product.title }} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Venue

  • Open product-grid-item.liquid file.

  • Under the line that includes product-card__title , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Marble

Sahara

  • Open card-product.liquid file.

  • Under the line that includes <!-- /.card-product__title , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product_ref.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product_ref.id}}" handle="{{product_ref.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Wokiee

  • Open product-grid-item-design-1.liquid file.

  • Under the line that includes </h2> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Maranello

Mono

  • Open card-product.liquid file.

  • Under the line that includes </h3> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{card_product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{card_product.id}}" handle="{{card_product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Blum

  • Open card-product.liquid file.

  • Under the line that includes </h3> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Modular

  • Open product-grid-item.liquid file.

  • Under the line that includes product-block__title , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Broadcast

  • Open product-grid-item.liquid file.

  • Under the line that includes product-item__title , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Pipeline

  • Open snippets/product-grid-item.liquid file.

  • Above the line that includes if settings.product_grid_show_rating , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Story

  • Open product-grid-item.liquid file.

  • Above the line that includes <p class="price_wrapper{% if on_sale %} on-sale{% endif %}"> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Palo Alto

  • Open product-grid-item.liquid file.

  • Above the line that includes {%- if settings.show_rating , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Automation

  • Open product-grid-item.liquid file.

  • Above the line that includes {%- if settings.enable_product_reviews -%} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Champion

Upscale

  • Open product-card.liquid file.

  • Above the line that includes {%- if settings.product_card_show_product_rating , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Atom

  • Open product-card.liquid file.

  • Above the line that includes {% if section.settings.show_rating , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Habitat

Reformation

Tailor

Vision

  • Open product-card.liquid file.

  • Under the line that includes {{ product_card_product.title }} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product_card_product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product_card_product.id}}" handle="{{product_card_product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Portland

Stockmart

  • Open product-card.liquid file.

  • Above the line that includes {% render 'price' , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product_card_product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product_card_product.id}}" handle="{{product_card_product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Symmetry

  • Open product-block.liquid file.

  • Under the line that includes class="product-block__title" , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Galleria

  • Open product-card.liquid file.

  • Above the line that includes <div class="#product-card-price"> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Whisk

  • Open product-card.liquid file.

  • Above the line that includes {%- if show_price -%} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product_card_product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product_card_product.id}}" handle="{{product_card_product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Mojave

  • Open product-card.liquid file.

  • Above the line that includes <div class="product-card__meta , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product_ref.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product_ref.id}}" handle="{{product_ref.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Alchemy

Avatar

Berlin

Frame

Handmade

Honey

Tailor

ShowTime

Stockholm

Zest

  • Open product-card.liquid file.

  • Under the line that includes </h3> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Taiga

  • Open product-card.liquid file.

  • Under the line that includes <h2 class="card-title h4">{{ product.title }}</h2> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Emporium

  • Open product-card.liquid file.

  • Under the line that includes </h5> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Influence

  • Open ship-product-card.liquid file.

  • Above the line that includes {% if block_name == 'price' %} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{card_product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{card_product.id}}" handle="{{card_product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Aurora

  • Open product-card.liquid file.

  • Under the line that includes {%- if enable_product_review -%} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Sunrise

  • Open ship-product-card.liquid file.

  • Above the line that includes {% render 'product-price', product: product_card_product %} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product_card_product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product_card_product.id}}" handle="{{product_card_product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Canopy

  • Open product-block.liquid file.

  • Above the line that includes <div class="price , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Masonry

  • Open product-block.liquid file.

  • Under the line that includes {{ product.title }} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Stiletto

  • Open product-item.liquid file.

  • Above the line that includes {% if settings.product_listing_show_vendor and prod.vendor %} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{prod.metafields.ryviu.product_reviews_info | escape }}" product_id="{{prod.id}}" handle="{{prod.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Local

Combine

  • Open product-item.liquid file.

  • Above the line that includes {%- when 'rating' -%} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Capital

  • Open product-item.liquid file.

  • Above the line that includes <div class="product-item-price"> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{item.metafields.ryviu.product_reviews_info | escape }}" product_id="{{item.id}}" handle="{{item.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Highlight

Kingdom

  • Open product-item.liquid file.

  • Above the line that includes product-item__price , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Spark

  • Open product-item.liquid file.

  • Under the line that includes </h4> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Atlantic

  • Open product-item.liquid file.

  • Under the line that includes </h2> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{itemType.metafields.ryviu.product_reviews_info | escape }}" product_id="{{itemType.id}}" handle="{{itemType.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Electro

  • Open product-item.liquid file.

  • Above the line that includes {% include 'product-grid-review' %} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Blockshop

Emerge

  • Open product--item.liquid file.

  • Above the line that includes if rating_enabled , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Paper

  • Open component__product-item.liquid file.

  • Under the line that includes </h3> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Editions

  • Open small-product-item.liquid file.

  • Under the line that includes </h3> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{itemType.metafields.ryviu.product_reviews_info | escape }}" product_id="{{itemType.id}}" handle="{{itemType.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Yuva

  • Open product-grid.liquid file.

  • Under the line that includes yv-product-title , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Cascade

  • Open product-tile.liquid file.

  • Above the line that includes {% if settings.product_tile_star_ratings , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Shapes

  • Open product-tile.liquid file.

  • Under the line that includes {{ product.title | escape }} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Context

  • Open product-tile.liquid file.

  • Under the line that includes </h2> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Fashionopolism

Icon

Mr Parker

Testament

Vantage

  • Open product-listing.liquid file.

  • Above the line that includes {% render 'product-price-listing', product: product %} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Envy

Fresh

  • Open product-grid--indiv-product.liquid file.

  • Under the line that includes {{ liquidObject.title }} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{liquidObject.metafields.ryviu.product_reviews_info | escape }}" product_id="{{liquidObject.id}}" handle="{{liquidObject.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Pursuit

  • Open product-card-item.liquid file.

  • Under the line that includes {{ product.title }} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Mavon

  • Open product-card-item.liquid file.

  • Above the line that includes {%- if show_price -%} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product_card_product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product_card_product.id}}" handle="{{product_card_product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Avenue

  • Open product-loop.liquid file.

  • Under the line that includes <div class="product-title"> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Drop

Foodie

Forge

  • Open product-loop.liquid file.

  • Above the line that includes {%- if settings.show_rating , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Bullet

  • Open global-product-card.liquid file.

  • Under the line that includes {{ product.title }} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Parallax

Responsive

Retina

  • Open product-thumbnail.liquid file.

  • Above the line that includes {% if settings.display_vendor_collection %} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Fame

  • Open product-info.liquid file.

  • Above the line that includes <div class="product-prizebox"> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Grid

Pacific

  • Open product-list-item.liquid file.

  • Under the line that includes {{ item.title }} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{item.metafields.ryviu.product_reviews_info | escape }}" product_id="{{item.id}}" handle="{{item.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Providence

  • Open product.liquid file.

  • Above the line that includes {% if show_vendor %} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Startup

  • Open product-list-item.liquid file.

  • Above the line that includes <p class="product-list-item-price"> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{item.metafields.ryviu.product_reviews_info | escape }}" product_id="{{item.id}}" handle="{{item.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Align

  • Open component-card-product.liquid file.

  • Above the line that includes {%- unless show_footer == false -%} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Modules

  • Open productRender.liquid file.

  • Under the line that includes {{ product.title }} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Bazaar

  • Open product-card-minimal.liquid file.

  • Under the line that includes {{ product.title }} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Roam

  • Open product.loop.liquid file.

  • Under the line that includes {% if show_vendors %} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

California

Colors

  • Open collection-product.liquid file.

  • Under the line that includes {{ product.title }} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Andaman

  • Open block.liquid file.

  • Above the line that includes <div class="block-price"> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Loft

  • Open product-loop-item.liquid file.

  • Above the line that includes {%- if show_reviews -%} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Health & Beauty

  • Open product-card-info.liquid file.

  • Above the line that includes {% if settings.show_review_badge %} , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Charge

  • Open grid-item-product.liquid file.

  • Under the line that includes <p class="item-title">{{ product.title | default: 'Example product title' }}</p> , insert the following code:

<!-- RYVIU APP :: COLLECTION-WIDGET-TOTAL -->	
<div class="ryviu-collection">
<ryviu-widget-total collection="1" reviews_data="{{product.metafields.ryviu.product_reviews_info | escape }}" product_id="{{product.id}}" handle="{{product.handle}}"></ryviu-widget-total>
</div>
<!-- RYVIU APP -->
  • Click Save.

Here is how it looks on the front end:

Show star ratings on the collection page

Need help?

Get in touch with our support team through live chat or email at [email protected]. We're here to help!

Did this answer your question?