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".

Section settings

General

Settings	Meaning
Section width	Select the layout width of the whole section. The options are: Default (same as the body width) Width (1170px) Width (1770px) Full Width (100% of the viewport width).
Padding for 'full width' option on desktop	Determine the left and right spacing of the full width layout.
Style	Select the position layout for the section content. The options are: Style 1 Style 2 Style 3
Background color	Apply color on the background of the section.
Background gradient	Apply color on the background gradient of the section.
Background image	Upload / Select an image as the section background.
Show title above review content	Toggle to show the title above the review content. Note: Only applicable for style 2.

Section

Settings	Meaning
Title	Enter the title for the section.
Title color	Apply color on the section title.
Title bottom margin	Determine the spacing of the title from the bottom.
Title font size	Determine the font size of the title.
Title font size on 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 bottom margin	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.

Review block

Settings	Meaning
Block layout	Select the layout for all blocks. The options are: Layout 1 Layout 2 Layout 3
Reviews per row	Select the row count for reviews to render. The options are 1/2/3/4/5. Note: Not applicable for layout 3.
Show navigation arrows	Toggle the arrows on review slider.
Enable center mode	Enables centered view with partial prev/next slides. Use with odd numbered slidesToShow counts.
Show avatar	Toggle to show or hide the avatar. Note: Not applicable for layout 3.
Bottom margin	Set the spacing of the reviewer's avatar from the bottom.
Heading
Text color	Set the color for the review heading.
Font size	Determine the font size of the review heading.
Bottom margin	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, Extra bold, Black.
Subheading
Text color	Set the color for the review subheading.
Font size	Determine the font size for the review subheading.
Bottom margin	Determine the spacing of the review subheading from the bottom.
Name
Text color	Set the color for the reviewers' names.
Font size	Determine the font size of the reviewers' names.
Bottom margin	Determine the spacing of the reviewers' names from the bottom.
Date
Text color	Set the color for the review dates.
Font size	Determine the font size of review dates.
Content
Text color	Set the color for the review message.
Font size	Determine the font size of the review message.
Bottom margin	Determine the spacing of the review message from the bottom.
Icon
Icon color	Set the color for the icons.
Background color	Set the color for the icon backgrounds.
Star
Font size	Determine the font size of the stars.
Bottom margin	Determine the spacing of the rating stars from the bottom.
Position	Select the position layout for the stars. The options are: Above the title Below the title Note: Only applicable for layout 2.
Star color	Set the color of the stars. With no color specified, the rating star color will fallback to its default (orange).
Star empty color	Set the color for the empty stars.

Scrollbar

Settings	Meaning
Height	Set the height of the scrollbar.
Track background color	Set the track background color
Thumb background color	Set the thumb background color
Thumb background hover color	Set the thumb background hover color

Section top padding

Settings	Meaning
Desktop	Determines the height of the top inner space of the section on the desktop device. Can be from 0px to 150px, increasing arithmetically of 5px (pixel).
Tablet	Determines the height of the top inner space of the section on the tablet device. Can be from 0px to 150px, increasing arithmetically of 5px (pixel).
Mobile	Determines the height of the top inner space of the section on the mobile device. Can be from 0px to 150px, increasing arithmetically of 5px (pixel).

Section bottom padding

Settings	Meaning
Desktop	Determines the height of the bottom inner space of the section on the desktop device. Can be from 0px to 150px, increasing arithmetically of 5px (pixel).
Tablet	Determines the height of the bottom inner space of the section on the tablet device. Can be from 0px to 150px, increasing arithmetically of 5px (pixel).
Mobile	Determines the height of the bottom inner space of the section on the mobile device. Can be from 0px to 150px, increasing arithmetically of 5px (pixel).

Block Settings

Review

Settings	Meaning
Avatar	Select/Upload image for reviewer's avatar.
Heading	Fill in the heading for the review card.
Subheading	Enter the subheading for the review card.
Rating	Select the rating start from 0 to 5.
Name	Enter the reviewer's name.
Date	Enter the review date. Example: Wednesday, Jan 26, 2019
Content	Enter the review message for the review card.