Skip to main content
Adding Star Ratings on collections
Updated over a week ago

Collections help customers browse the product categories that they’re interested in without having to look through multiple pages of products.

In this article, we'll show you how to install Star Ratings on your collections, including collection pages and homepage.

Install using Shopify theme editor (easy)

If you're using an Online Store 2.0 theme (like Dawn), you can enable Star Ratings for your collections inside Shopify theme editor.

For collection pages

  1. From your Shopify admin, go to Online Store > Themes.

  2. Find the theme you want and click Customize.

  3. From the drop-down menu at the top, choose Collections > Default collection.

  4. On the left menu, select Product grid and enable Show product rating.

  5. Click Save.


For featured collection on homepage

  1. From your Shopify admin, go to Online Store > Themes.

  2. Find the theme you want and click Customize.

  3. From the drop-down menu at the top, choose Homepage.

  4. On the left menu, select Featured collection and enable Show product rating.

  5. Click Save.


Install using liquid code (advanced)

If you want the Star Ratings to be Judge.me branded, you can install it using liquid code.

Star Ratings installed via code will show on both your collection pages and the collection on your homepage. It also allows you to change the position of the ratings.

Step 1: Enable Judge.me app embed

  1. From your Shopify admin, go to Online Store > Themes.

  2. Find the theme you want and click Customize.

  3. Go to App embeds and enable Judge.me.

  4. Click Save.

Step 2: Add the Star Ratings code

  1. Once you've enabled Judge.me app embed, go back to Online Store > Themes.

  2. Click "..." > Edit code.

  3. Then depending on your theme, the next steps might differ.

Theme

Installation steps

Athens

Be Yours

Chord

Colorblock

Craft

Crave

Dawn

Eurus

Ignite

Launch

Origin

Publisher

Ride

Refresh

Sense

Spotlight

Studio

Taste

Trade

Viola

  • Open card-product.liquid.

  • Above the line that contains {%- if show_rating , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ card_product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Marble

Sahara

  • Open card-product.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product_ref.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Maranello

Mono

Divide

  • Open card-product.liquid.

  • Under the line that contains </h3> , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ card_product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Blum

  • Open card-product.liquid.

  • Under the line that contains </h3> , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Baseline

Creative

District

Expanse

Fetch

Flow

Impulse

Label

Motion

North

Streamline

Sydney

  • Open product-grid-item.liquid.

  • Under the line that contains {{ product.title }} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Modular

  • Open product-grid-item.liquid.

  • Under the line that contains product-block__title , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Broadcast

  • Open product-grid-item.liquid.

  • Under the line that contains product-item__title , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Pipeline

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

  • Above the line that contains if settings.product_grid_show_rating , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Story

  • Open product-grid-item.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Empire

  • Open product-grid-item.liquid.

  • Under the line that contains </h2> , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Palo Alto

  • Open product-grid-item.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Venue

  • Open product-grid-item.liquid.

  • Under the line that contains product-card__title , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Automation

  • Open product-grid-item.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Wokiee

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

  • Under the line that contains </h2> , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Champion

Upscale

  • Open product-card.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Atom

  • Open product-card.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Habitat

Reformation

Tailor

Vision

  • Open product-card.liquid.

  • Under the line that contains {{ product_card_product.title }} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product_card_product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Unicorn

  • Open product-card.liquid.

  • Under the line that contains </h3> , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product_card_product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Portland

Stockmart

  • Open product-card.liquid.

  • Above the line that contains {% render 'price' , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product_card_product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Symmetry

  • Open product-block.liquid.

  • Under the line that contains class="product-block__title" , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Aurora

  • Open product-card.liquid.

  • Under the line that contains {%- if enable_product_review -%} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Galleria

  • Open product-card.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Whisk

  • Open product-card.liquid.

  • Above the line that contains {%- if show_price -%} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product_card_product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Mojave

  • Open product-card.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product_ref.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Alchemy

Avatar

Berlin

Frame

Handmade

Honey

Tailor

ShowTime

Stockholm

Zest

  • Open product-card.liquid.

  • Under the line that contains </h3> , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Taiga

  • Open product-card.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Emporium

  • Open product-card.liquid.

  • Under the line that contains </h5> , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Minimog

  • Open product-card.liquid.

  • Under the line that contains {% if settings.show_review_badge %} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Concept

  • Open product-card.liquid.

  • Above the line that contains {%- render 'product-price' , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Influence

  • Open ship-product-card.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ card_product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Sunrise

  • Open ship-product-card.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product_card_product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Canopy

  • Open product-block.liquid.

  • Above the line that contains <div class="price , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Masonry

  • Open product-block.liquid.

  • Under the line that contains {{ product.title }} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Prestige

Xtra

  • Open product-item.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Focal

Ira

Lorenza

Split

Warehouse

  • Open product-item.liquid.

  • Under the line that contains {{ product.title }} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Stiletto

  • Open product-item.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ prod.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Local

Combine

  • Open product-item.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Capital

  • Open product-item.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ item.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Highlight

Kingdom

  • Open product-item.liquid.

  • Above the line that contains product-item__price , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Spark

  • Open product-item.liquid.

  • Under the line that contains </h4> , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Atlantic

  • Open product-item.liquid.

  • Under the line that contains </h2> , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ itemType.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Electro

  • Open product-item.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Tema Aurora

Tema Warehouse

  • Open product-item.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Blockshop

Emerge

  • Open product--item.liquid.

  • Above the line that contains if rating_enabled , add the following code:

echo '<div class="jdgm-widget jdgm-preview-badge" data-id="{{ product.id }}">'
echo product.metafields.judgeme.badge
echo '</div>'
  • Click Save.

Paper

  • Open component__product-item.liquid.

  • Under the line that contains </h3> , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Editions

  • Open small-product-item.liquid.

  • Under the line that contains </h3> , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ itemType.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Yuva

  • Open product-grid.liquid.

  • Under the line that contains yv-product-title , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Cascade

  • Open product-tile.liquid.

  • Above the line that contains {% if settings.product_tile_star_ratings , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Shapes

  • Open product-tile.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Context

  • Open product-tile.liquid.

  • Under the line that contains </h2> , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Fashionopolism

Icon

Mr Parker

Testament

Vantage

  • Open product-listing.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Envy

Fresh

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

  • Under the line that contains {{ liquidObject.title }} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ liquidObject.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Pursuit

  • Open product-card-item.liquid.

  • Under the line that contains {{ product.title }} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Mavon

  • Open product-card-item.liquid.

  • Above the line that contains {%- if show_price -%} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product_card_product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Avenue

  • Open product-loop.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Drop

Foodie

Forge

  • Open product-loop.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Bullet

  • Open global-product-card.liquid.

  • Under the line that contains {{ product.title }} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Parallax

Responsive

Retina

  • Open product-thumbnail.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Beyond

  • Open product-rating.liquid.

  • Above the line that contains if rating_enabled , add the following code:

echo '<div class="jdgm-widget jdgm-preview-badge" data-id="{{ product.id }}">'
echo product.metafields.judgeme.badge
echo '</div>'
  • Click Save.

Fame

  • Open product-info.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Turbo

Turbo-portland

  • Open product-info.liquid.

  • Under the line that contains {{ product.title }} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Grid

Pacific

  • Open product-list-item.liquid.

  • Under the line that contains {{ item.title }} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ item.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Startup

  • Open product-list-item.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ item.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Align

  • Open component-card-product.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Modules

  • Open productRender.liquid.

  • Under the line that contains {{ product.title }} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Bazaar

  • Open product-card-minimal.liquid.

  • Under the line that contains {{ product.title }} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Roam

  • Open product.loop.liquid.

  • Under the line that contains {% if show_vendors %} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

California

Colors

  • Open collection-product.liquid.

  • Under the line that contains {{ product.title }} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Andaman

  • Open block.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Providence

  • Open product.liquid.

  • Above the line that contains {% if show_vendor %} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Loft

  • Open product-loop-item.liquid.

  • Above the line that contains {%- if show_reviews -%} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Debut

  • Open product-card-grid.liquid.

  • Under the line that contains {{ product.title }} , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Health & Beauty

  • Open product-card-info.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Charge

  • Open grid-item-product.liquid.

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

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Showcase

  • Open product-block.liquid.

  • Above the line that contains {% if settings.show_product_block_reviews , add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Ella

  • Open product-card.liquid.

  • Above the line that contains {% render 'product-card-summary', add the following code:

<!-- Start of Judge.me code -->
<div class='jdgm-widget jdgm-preview-badge'>
{{ product_card_product.metafields.judgeme.badge }}
</div>
<!-- End of Judge.me code -->
  • Click Save.

Themes that we haven't documented:

  • Gem

  • Woodstock

  • Kairo

  • Lute

  • Banjo

  • Huge

  • Nostalgia

  • Maker

  • Xclusive

  • Exhibit

  • Momentum

  • Urge

  • Abode

  • Neat

  • Unicorn

  • Creator

If you need help adding Star Ratings on collections, contact our team at [email protected]. We're available to help 24/7!

Did this answer your question?