The Testimonials with Image section is a powerful way to build trust by showcasing real customer feedback alongside their photos. Combining quotes with visuals makes your testimonials more engaging and credible.

In this guide, you’ll learn how to customize this section to highlight customer voices and enhance your brand story.

1. How to access a Testimonials with Image section

You can access a Testimonials with Image section by following these simple steps:

1. From Shopify Admin, click on Online Store > Select Themes > In the Current theme section, click the Customize button.

2. In the theme editor (Customize), click the Sections button > Click the Add section button > In the Sections tab, scroll through the list or use the search bar to find and select Testimonials with Image.

2. How to edit a Testimonials with Image section

You can configure some general options for the Testimonials with Image section below:

2.1. Testimonials with image

• Color scheme: Choose the color theme for the entire section.
• Rating color: Change the color of the star ratings.
• Desktop image position: Set the position of the image on desktop view:

+ Left: Image appears on the left, text on the right.

+ Right: Image appears on the right, text on the left.

• Desktop spacing: Adjust the spacing (in pixels) between the image and the testimonial content on desktop view.
• Desktop product alignment: Control how the product (if added) aligns relative to the testimonial:
• Left: Product appears aligned to the left of the image
• Center: Product is centered below the image

Note: On mobile view, the product is always centered.

• Auto-rotate testimonials: Enable or disable automatic rotation of testimonials:

+ On: Testimonials will rotate automatically after a set time.

+ Off: Users need to click manually to view the next testimonial.

• Change testimonials every: Set how often testimonials change when auto-rotate is enabled (in seconds)
• Pause on hover: When enabled, testimonial rotation will pause if a user hovers over the section. This is useful for giving visitors more time to read.

2.2. Section header

• Caption: Enter a small piece of text that appears above the main heading — often used to label or introduce the section
• Show icon: Toggle this ON/OFF to show or hide the icon next to the caption
• Heading: This box is where you input the title of section. You can format the text using bold, italic, link...
• Heading size: Choose the font size of the heading. Options included like Large, Medium, Smalll, Extra small, Extra extra small
• Heading style: Choose the style of the heading, options included:

+ Normal: Displays the heading with standard capitalization.

+ Uppercase: Displays the heading in all capital letters.

• Heading tag: Sets the HTML tag of the heading, which does affect SEO. You can also change the Heading tag to:

+ H1-H6: Sets the HTML tag of the heading, which does affect SEO.

+ div: A generic container element with no semantic meaning.

+ span: An inline element, also with no semantic value.

+ p: Wraps the heading in a paragraph tag, meaning it's treated as regular text (not a heading).

• Heading alignment: Align the heading Left or Center within the section

2.3. Section padding

• Top padding: Sets the space between the top of the video section and the element above it (in pixels).
• Bottom padding: Sets the space between the bottom of the video section and the element below it (in pixels).
• Mobile top padding: Sets the space between the top of the video section and the element above it (in pixels) on mobile devices.
• Mobile bottom padding: Sets the space between the bottom of the video section and the element below it (in pixels) on mobile devices.

3. How to edit a Testimonial block

To add a Testimonial block, click the Add Testimonial button (plus icon ➕) under the Testimonials with Image section.

You can configure some general options for the Testimonial block below:

• Image: Upload a main image that visually supports the testimonial. Click Select to upload your own image. You can also choose from free images provided.
• Mobile image: Upload a separate image to be used specifically for mobile devices. Click Select to upload your own image. You can also choose from free images provided.
• Product: Associate this testimonial with a specific product. Click "Select" to choose a product from your store so customers can relate the review directly to it.
• Show star rating: Toggle this ON if you want to display a star rating as part of the testimonial.
• Star rating: Choose the number of stars to display using the slider or enter a number (1 to 5).
• Text: Enter the actual testimonial text. You can format the text using Bold, Italic, Link,...
• Avatar: Upload a photo of the customer giving the testimonial (recommended: 100x100px). This adds authenticity and a personal touch.
• Round avatar: Enable this toggle if you want the avatar to appear in a circular shape (default is square).
• Author: Enter the name of the person giving the testimonial. You can also format this using bold, italic, or link options.

Updated on: 15/08/2025