The Grid Reviews Widget shows a product's reviews as a wall of cards, photos first, under the same rating summary as the PDP Reviews Widget. It suits products where customer photos sell, like beauty, fashion and home. A click on any card opens the full review.

Shows on	Product pages
Add it from	Settings ▸ Widgets ▸ Grid Reviews Widget ▸ Add to theme
Needs	The Quoli Core Script app embed
Plans	Every plan. The QI summary needs Growth and up, or Starter yearly.

The Grid Reviews Widget on a product page

Add it to your product page

In Quoli, open Settings ▸ Widgets and find Grid Reviews Widget.
Click Add to theme. Your theme editor opens on the product template with the widget added as a new section.
Drag the section into place and click Save.

Use the Grid instead of the PDP Reviews Widget, not beside it: both are a product's full reviews section. The setup guide counts either one for Publish reviews on product pages.

What shoppers see

The header

The top of the Grid is the same as the PDP Reviews Widget: the Reviews tab and the Questions tab, your score and rating bars, the featured attribute, the recommendation line, What shoppers say, search, filters and sort. The PDP Reviews Widget article walks through every part. The Grid has no customer photos row: its cards already lead with the photos.

The cards

Grid review cards with their parts numbered

➀ The first photo or video. Shown at its own shape, with +N when the review has more. Videos carry a play mark.

➁ Name and rating. The reviewer's name with a check when they're a verified buyer, then the stars and the date. Name and date formats follow Settings ▸ General.

➂ Title and review. Long reviews are cut short on the card. The popup shows the rest.

Cards keep their column when more reviews load, so nothing jumps under the shopper's eye. The Grid doesn't show reviewer photos or locations on its cards.

The review popup

A click on a card opens the review in a popup with every photo and video, the reviewer's answers, your reply, and Useful and Share.

Columns and phones

Pick 2, 3 or 4 columns under Columns. That many show on wide screens, up to 3 on tablets, and 2 on phones.

Block settings

Select the widget in your theme editor to change these. Colors and fonts come from Settings ▸ Brand in Quoli, so every widget matches.

Header

Setting	What it does	Default
Show Reviews / Questions tabs	The two tabs. Off shows reviews only.	On
Reviews tab label, Questions tab label	The tab names.	Reviews, Questions
Show rating distribution	The rating bars.	On
Show attribute scale	Your featured rating-scale question.	On
Show recommendation percentage	The "would recommend" line.	On
Show 'Write a review' button	The button under the score.	On
Write button label	Its text.	Write a review
Show 'Ask a question' button	The button in the Questions tab.	On
Ask button label	Its text.	Ask a question
Show AI summary and sentiments	The What shoppers say card and its full summary.	On
Empty state title	The heading on a product with no reviews yet.	Be the first to review this product

Layout

Setting	What it does	Default
Columns	2, 3 or 4 on wide screens. Phones show two.	4
Reviews to show	How many cards show first. Up to 50 load at once, even when the slider is higher.	20
Pagination	A Load more button, numbered pages, or more cards as shoppers scroll.	Load more button
Reviews per load more	How many more load each time, 3 to 50. Not used with numbered pages.	10
Load more label	The button's text.	Show more reviews

Reviews

Setting	What it does	Default
Show	Text and media reviews, or only reviews with a photo or video.	Text and media reviews
Sort	The order cards open in: Most recent, Most useful, Highest rated, Lowest rated or Oldest.	Most recent
Show search, Show filters, Show sorting	The search box, the Filters button and the sort menu.	On

Cards

Setting	What it does	Default
Show reviewer name	The name on each card.	On
Show verified badge	The check beside verified buyers.	On
Show star rating	The stars on each card.	On
Show review date	The date on each card.	On
Show Useful button, Show Share button	Useful and Share in the review popup.	On

Spacing

Setting	What it does	Default
Top padding, Bottom padding	Space above and below the widget, 0 to 40 px.	20 px each

Add it with code

On a theme without app blocks, paste the widget in yourself. The code is in Settings ▸ Widgets ▸ Grid Reviews Widget ▸ Instructions, with a Copy code button.

<quoli-grid-reviews
  product-id="{{ product.id }}"
  merchant-id="{{ shop.permanent_domain }}"
  api-base="/apps/quoli"
  data-product-name="{{ product.title | escape }}"
  data-product-handle="{{ product.handle | escape }}"
></quoli-grid-reviews>

Paste it into a Custom Liquid block on your product template, or into the template's code where the reviews should go.
Keep the Quoli Core Script app embed on. It loads the widget.

Pasted code uses the default settings above. To change them, use the app block instead.

💡 Tip: Set Show to Reviews with photo or video for a pure photo wall, and keep the PDP's text reviews for shoppers who search or filter.

Next: Home Carousel

🧱 Grid Reviews Widget