Product rating

Overview

A comprehensive product rating display block that renders the rating information for a product. The block supports various styling options, alignment controls, and responsive visibility settings to seamlessly integrate with different product layouts and themes.

Common use cases

• Configure the product resource setting to specify which product's rating to display

• Display product ratings on product pages and product cards

• Show customer reviews and ratings to build trust

Block settings

General

Setting	Description	Options
Show advanced settings	Reveals icon type, icon display, and visibility	Checkbox (default: false)

Content

Setting	Description	Options
Product	Select the product to display rating for	Product picker

Spacing

Setting	Description	Options
Enable horizontal padding	Adds horizontal padding around the rating	Checkbox (default: false)
Enable top padding	Adds top padding around the rating	Checkbox (default: false)
Enable bottom padding	Adds bottom padding around the rating	Checkbox (default: false)

Color

Setting	Description	Options
Text color	Controls the text color	• Default (default) • Alternative • Primary background • Primary foreground • Secondary background • Secondary foreground • Tertiary background • Tertiary foreground • Neutral background • Neutral foreground • Shade

Style

Setting	Description	Options
Icon type	Shape of rating icons	• Star (default) • Circle • Square Visible when icon display is not "none" Visible when Icon display != 'none' and Show advanced settings is on
Icon display	Controls how rating icons are displayed	• None • Default (default) • Simple Visible when Show advanced settings is on
Icon style	Style variant for rating icons	• Classic (default) • Sharp Visible when icon display is not "none"
Icon size	Size of rating icons	10 - 100 px (default: 14) Visible when icon display is not "none"
Font family	Controls the font family used for rating text	• Standard • Heading • Subheading • Accent Visible when font size contains 'type--'
Font size	Controls the font size of rating text	• Smaller • Small • Default (default) • Big • Bigger • Heading 1 • Heading 2 • Heading 3 • Heading 4 • Heading 5 • Heading 6

Layout

Setting	Description	Options
Horizontal alignment	Controls horizontal alignment	• Left (default) • Center • Right

Display

Setting	Description	Options
Visibility	Controls when the block is visible	• All (default) • Mobile only • Desktop only Visible when Show advanced settings is on