The Testimonials section shows one customer quote at a time above a row of logos, such as press mentions or partner brands. Each logo has its own quote, so customers can click a logo to read the quote that belongs to it.
You can also let the section move through the quotes automatically.
Click Testimonials in the left sidebar to see the section settings on the right-hand sidebar.
Control how the logos look and whether the quotes change on their own.
Grayscale logos: Show the logos that are not selected in gray. A logo shows its colors when customers hover over it and when it is selected. When this option is off, the logos keep their colors, and the logos that are not selected are shown lighter.
Auto-rotate testimonials: Move to the next logo and quote automatically. After the last one, the section starts again from the first. Customers can still click any logo while the section is rotating.
Change testimonials every: Set how many seconds each quote stays on screen (5 seconds by default). Appears when Auto-rotate testimonials is enabled.
Pause on hover: Stop the rotation while the customer's pointer is over the section. Appears when Auto-rotate testimonials is enabled.
Adjust how the quote text is displayed.
Quote font size: Select the size of the quote text. Extra large is selected by default; larger sizes such as 3X large are also available.
Quote max width: Set the maximum width of the quotes in this section, in pixels. Set it to 0 to use the full width. Each Testimonial block also has its own Quote max width, and the narrower of the two values is used.
Border top: Add a thin line at the top of the section.
Border bottom: Add a thin line at the bottom of the section.
Adjust the space between the logos and between the quote and the logos. All values are in pixels.
Spacing between logos on desktop: Used on screens 1150px wide and larger.
Spacing between logos on tablet: Used on screens from 768px to 1149px wide.
Spacing between logos on mobile: Used on screens narrower than 768px.
Spacing between quote and logos (desktop): Used on screens 768px wide and larger.
Spacing between quote and logos (mobile): Used on screens narrower than 768px.
Control the colors and the width of the section.
Color scheme: Select the color scheme applied to the section. You can choose an available color scheme or customize it through Edit scheme.
Width: Choose how wide the section is.
Page: Keep the section within the page width.
Full: Stretch the section across the full screen width. Turn on Section Indent to keep some space on the left and right.
Fixed: Set an exact width in pixels with Fixed width (1200px by default).
Use these settings to adjust the space above and below the section.
Available options:
Padding: Top and Bottom, used on screens 768px wide and larger
Mobile padding: Top and Bottom, used on screens narrower than 768px
Theme Settings: Change the Page width without leaving the section. This is a theme-wide setting, so the new value applies to every section that uses it.
Custom CSS: Add custom styles to this section only. To add styles to your entire online store, use Custom CSS in the theme settings.
Each Testimonial block holds one logo and the quote shown when that logo is selected. In a newly added section, the three example blocks are named Logo. To add another one, click Add block under Testimonials and choose Testimonial.
When you click a block in the left sidebar, the editor shows its quote so you can see your changes. The available options include:
Image: Select or upload the logo image. Until you select one, a placeholder logo is shown.
Logo max width: Set the maximum width of this logo, in pixels, on screens 768px wide and larger.
Logo max width (mobile): Set the maximum width of this logo, in pixels, on screens narrower than 768px.
Quote: Enter the testimonial text for this logo. You can use bold, italic, links and lists.
Quote max width: Set the maximum width of this quote, in pixels. Set it to 0 to use the full width.
Click Section header under Testimonials to adjust the small title above the quote, such as Featured In Press.
Alignment: Align the header to the left, center or right. Desktop and mobile have separate settings.
Space bottom: Set the space between the header and the quote, in pixels. Desktop and mobile have separate settings.
Width: Choose Auto, or Custom to limit the header width with Max width (desktop only).
Click Add block under Section header to add a Group button, Heading, Spacer, Subheading or Text block. The example uses a Subheading block. Click it to edit the Text and choose its Color (Secondary is lighter than Primary) and Width (Auto, or Custom with a Max width).