> For the complete documentation index, see [llms.txt](https://help.fluorescent.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.fluorescent.co/eclipse/product-pages/product-content-blocks/product-rating.md).

# Product rating

{% hint style="info" %}
The Product rating block was added in v1.1.0 — Learn how to [update your theme](/eclipse/changelog/update-your-theme.md) to access the latest features.
{% endhint %}

For ratings to display, you must be using an app that supports Shopify's standard rating metafield. [Learn more](https://apps.shopify.com/search?q=product+reviews)

This block will not appear if there is no rating found.

<figure><img src="/files/hgYA7sYZj96R2ZHe0JUl" alt="" width="340"><figcaption></figcaption></figure>

## Add product rating

***

Under **Product overview**, click **(+) Add block** and select **Product rating**. Use the drag-and-drop handles **`⋮⋮`** to re-order blocks.  Click the block to start adding content.

{% hint style="warning" %}
**Editing a template will change all pages that use that template**.

[Create and assign new templates](https://github.com/fluorescent/kb-horizon/blob/main/product-pages/pages/editing-page-templates/create-and-assign-new-templates.md) to design different page layouts.

[Add dynamic content](https://github.com/fluorescent/kb-horizon/blob/main/product-pages/pages/editing-page-templates/dynamic-content-with-metafields.md) to show page-specific content in the same template.
{% endhint %}

### Change rating style

***

`Click Product rating to find settings`

<table><thead><tr><th width="190">Setting</th><th width="400">Description</th><th>Options</th></tr></thead><tbody><tr><td><mark style="color:blue;">Text</mark></td><td>Display the average rating score, the number of ratings, or both.</td><td><strong>Rating &#x26; Count</strong><br><strong>Rating</strong><br><strong>Count</strong></td></tr><tr><td><mark style="color:blue;">Layout</mark></td><td>Display number of stars or a single star icon.</td><td><strong>Default</strong><br><strong>Single icon</strong></td></tr></tbody></table>

### Add bottom padding

***

Use **Bottom padding** to adjust the layout of the product overview section by adding spacing between blocks.

&#x20;

`Click Product rating to find settings`

<table><thead><tr><th width="190">Setting</th><th width="400">Description</th><th>Options</th></tr></thead><tbody><tr><td><mark style="color:blue;">Bottom padding</mark></td><td>Add spacing below the block</td><td><p><strong>1 - 50px</strong> </p><p><em><mark style="background-color:yellow;">Default</mark></em><mark style="background-color:yellow;">: 24px</mark></p></td></tr></tbody></table>
