# Customer Review



To add this section, please follow below steps:

1. From your Shopify admin, go to **Online Store** **->** **Themes**.
2. Find the theme that you want to edit, and then click **Customize**.
3. Click **Add section** and choose "**Customer Review**".

<figure><img src="https://3284033180-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fag3h7ZduRGWlquTgGUHi%2Fuploads%2F1aAQuFuNqxm1D7GnPIDr%2Fcustomer%20review.gif?alt=media&#x26;token=76462d20-4ef1-464a-9fcd-f4ca7f64f81e" alt=""><figcaption></figcaption></figure>

## Section settings

### General

<table><thead><tr><th width="471">Settings</th><th>Meaning</th></tr></thead><tbody><tr><td>Layout</td><td>Select the layout width of the whole section. The options are: Default (same as the body width), 1170px, 1770px, Full Width (the 100% of the viewport width).</td></tr><tr><td>Padding Container Full Width</td><td>Determine the left and right spacing of the Full Width layout.</td></tr><tr><td>Style</td><td>Select the position layout for the section content. The options are:<br>- Style 1: Title, description are on top, and the reviews are on the bottom.<br>- Style: Title and description are to the left. The reviews become scrollable to the right.</td></tr><tr><td>Spacing Top / Spacing Bottom on Desktop, Tablet, Mobile</td><td>Determine the spacing of the section from its top and bottom sections on Desktop, Tablet and Mobile separately.</td></tr><tr><td>Background Color</td><td>Apply Color on the background of the section.</td></tr><tr><td>Background Gradient</td><td>Apply Color on the background gradient of the section.</td></tr><tr><td>Background Image</td><td>Upload / Select an image as the section background.</td></tr></tbody></table>

### Section

| Settings                   | Meaning                                                                                    |
| -------------------------- | ------------------------------------------------------------------------------------------ |
| Title                      | Enter the title for the section.                                                           |
| Title Color                | Apply color on the section title.                                                          |
| Title Margin Bottom        | Determine the spacing of the title from the bottom.                                        |
| Title Font Size            | Determine the font size of the title.                                                      |
| Title Font Size Mobile     | Determine the font size of the title on Mobile.                                            |
| Description                | Specify the text for the section description.                                              |
| Description Color          | Apply color on the description text.                                                       |
| Description Spacing Bottom | Determine the spacing of the description from its bottom.                                  |
| Description Font Size      | Determine the font size of the description.                                                |
| Alignment                  | Select the align of title and description to be either to be to the Left, Right or Center. |

#### SETTINGS REVIEW BLOCK

| Settings                     | Meaning                                                                                                                                                                                                                                                                                   |
| ---------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Layout Block                 | <p>Select the layout for all blocks.<br> - Layout 1: The review content is aligned to the left of the block. The rating stars lie above the review message. <br> - Layout 2: The review content is aligned to the center of the block. The rating stars lie below the review message.</p> |
| Review Row                   | Select the row count for reviews to render.                                                                                                                                                                                                                                               |
| Show Arrows (For Layout 2)   | Toggle the arrows on review slider for Layout 2.                                                                                                                                                                                                                                          |
| Avatar Margin Bottom         | Set the spacing of the reviewer's avatar from the bottom.                                                                                                                                                                                                                                 |
| Color Heading                | Set the color for the review heading.                                                                                                                                                                                                                                                     |
| Font Size Heading            | Determine the font size of the review heading.                                                                                                                                                                                                                                            |
| Heading Margin Bottom        | Determine the spacing of the heading from the bottom.                                                                                                                                                                                                                                     |
| Font Weight                  | Select the font weight of the heading to be either Normal, Medium, SemiBold, Bold, Bolder, Black.                                                                                                                                                                                         |
| Color Sub Heading            | Set the color for the review subheading.                                                                                                                                                                                                                                                  |
| Font Size Sub Heading        | Determine the font size for the review subheading.                                                                                                                                                                                                                                        |
| Sub Heading Margin Bottom    | Determine the spacing of the review subheading from the bottom.                                                                                                                                                                                                                           |
| Color Name                   | Set the color for the reviewers' names.                                                                                                                                                                                                                                                   |
| Font Size Name               | Determine the font size of the reviewers' names.                                                                                                                                                                                                                                          |
| Color Date                   | Set the color for the review dates.                                                                                                                                                                                                                                                       |
| Font Size Date               | Determine the font size of review dates.                                                                                                                                                                                                                                                  |
| Color Content                | Set the color for the review message.                                                                                                                                                                                                                                                     |
| Font Size Content            | Determine the font size of the review message.                                                                                                                                                                                                                                            |
| Body Margin Bottom           | Determine the spacing of the review message from the bottom.                                                                                                                                                                                                                              |
| Color Icon                   | Set the color for the icons.                                                                                                                                                                                                                                                              |
| Background Color             | Set the color for the icon backgrounds.                                                                                                                                                                                                                                                   |
| Star Margin Bottom           | Determine the spacing of the rating stars from the bottom.                                                                                                                                                                                                                                |
| Show Avatar?                 | Toggle to show reviewers' avatars.                                                                                                                                                                                                                                                        |
| Star Position (For Layout 2) | For layout 2, ratings always appear above review message. This setting is to specify whether the stars are above or below the title as well.                                                                                                                                              |
| Star Color                   | Set the color of the stars. With no color specified, the rating star color will fallback to its default (orange).                                                                                                                                                                         |



## Block Settings

### Review

| Settings      | Meaning                                       |
| ------------- | --------------------------------------------- |
| Avatar        | Select/Upload image for reviewer's avatar.    |
| Heading       | Fill in the heading for the review card.      |
| Sub Heading   | Enter the subheading for the review card.     |
| Rating (Star) | Select the rating start from 0 to 5.          |
| Name          | Enter the reviewer's name.                    |
| Date          | Enter the review date.                        |
| Content       | Enter the review message for the review card. |
