Star Ratings on Shopify Collection Pages

Short answer: Shopify won't let an app place stars directly inside your collection-page product cards — no Online Store 2.0 theme accepts an app block there — so the working fix is two rating metafields plus a small Liquid snippet you or a developer add to the theme's product-card file, which renders with the page and needs no script.

Why can't a review app just add stars to my collection grid?

An app on Shopify adds stars two ways: an app block you drag into the theme editor, or a script that runs in the browser after the page loads.

Neither one reaches a product card in a collection grid. App blocks slot into sections a theme explicitly allows, and no Online Store 2.0 theme — Dawn included — allows one inside the product-card loop that draws a collection page.

A script could try to reach in from outside, but a collection page can show dozens of products at once. One widget instance per card means dozens of separate requests and dozens of small layout shifts as each one loads in, on the page a shopper scans fastest and is quickest to leave.

The part that actually works: metafields and a snippet

Kudo writes two standard Shopify metafields onto each product: reviews.rating and reviews.rating_count. Those are the same metafields Shopify's own Search & Discovery and filter apps already read, so a theme built to use them draws stars in Liquid, with no script.

A small snippet — you copy it into your own theme's product-card file — reads those two metafields and prints stars right there, server-side, at the same time the rest of the page renders. No extra request, no layout shift, because nothing loads after the page does.

This is the trade a snippet makes: it can't install itself the way an app block can, so it takes one small manual step. Once it's in the file, it draws stars on every product card in every collection automatically, without being re-added per product.

How to add it to your theme

None of this touches your app settings inside Kudo — it's a one-time change to a theme file, and it stays in place through most theme updates unless a Shopify update rewrites that specific snippet from scratch, which is rare enough that it's worth a quick check after a major theme upgrade rather than something to expect every time.

Find your product-card file

Open your theme code (Online Store, then Edit code) and look for the snippet that draws a single product inside a collection grid — often named something like "card-product" or "product-card". Dawn and most modern themes keep this in its own file rather than inline.

Paste the snippet near the price or title

Add the star markup near the product title or price, so it reads naturally in the layout. Save, then open a live collection page to check the spacing.

Check a few different card widths

Collection grids often show the same card in two or three column widths — mobile, tablet, desktop. Confirm the stars don't wrap awkwardly at the narrowest one.

What if editing Liquid isn't something you want to touch?

This is a genuine code edit, not a toggle in an app's settings screen — better to say that plainly than to imply a one-click install gets you here.

If you don't want to open theme code yourself, a Shopify theme developer can add this snippet in under an hour for most themes; it's a small, contained change and worth mentioning by name when you ask one for a quote. If you're still choosing between review apps for Shopify, see what to check before you install one.

Until then, your reviews still show everywhere else: on the product page itself, in a widget elsewhere on your site, and in your Google Shopping feed if you submit one — the collection grid is the one surface that needs the manual step.

The Two-Minute Version

Kudo writes the reviews.rating and reviews.rating_count metafields for you and gives you the ready-to-paste snippet in the widget builder — you still add it to your theme once, but there's nothing to configure beyond that.

Start free at getkudo.co.

Frequently Asked Questions

Why doesn't Shopify just let apps add stars everywhere?
Product cards in a collection grid are rendered by the theme itself, in bulk, for performance — letting outside apps inject markup into that loop on every card would slow down the page Shopify optimizes hardest.

Will this work with any Shopify theme?
Most Online Store 2.0 themes keep product cards in a single reusable snippet file, so the edit is similar across them. Very old, pre-2.0 themes may structure things differently and need a developer to locate the right file.

Does this affect my Shopify SEO or Search & Discovery filters?
The reviews.rating and reviews.rating_count metafields are the same ones Shopify's Search & Discovery and filter apps read, so writing them helps those features too, separately from the stars showing on the card.

Can I get stars on the collection grid without any code at all?
Not today. No Online Store 2.0 theme accepts an app block inside a product card, so a snippet in your theme file is the only route that renders one there.

Does adding the snippet slow the page down?
No. It reads two metafields and prints text server-side, at the same time the rest of the card renders. Nothing loads afterward.

Will the stars break if I switch themes later?
A new theme means finding the product-card file again and pasting the snippet in — the metafields themselves stay on your products either way, since they live on the product, not on the theme.