Customer Review
Last updated
Last updated
To add this section, please follow below steps:
From your Shopify admin, go to Online Store -> Themes.
Find the theme that you want to edit, and then click Customize.
Click Add section and choose "Customer review".
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.
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.
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.
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
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).
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).
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.
