Electro How to Use Electro Testimonial

Theme: Electro · Section type: All-template section

A Testimonials section shows customer reviews as cards, each with a star rating, the review text, and the author's photo, name, and title. You can link each review to the product the customer bought, so the review also works as product feedback and builds trust.

Note: You can add this section to any template, except the header and footer. The section comes with 5 Testimonial blocks.

Electro Testimonials section with star ratings, authors, and bought products

What you can do

Add the section and your reviews
Show the product each customer bought
Show the reviews in a carousel or a grid
See what customers see
Change the card colors and layout
Fix common problems

Add the section and your reviews

In the theme editor, open the template where you want the section.
In the left sidebar, click Add section > Testimonials.
Under General, enter a Section subheading, Section heading, and Description. Leave a field empty to hide it.
Click a Testimonial block.
Select an Avatar, set the Rating, and enter the Author, Author title, and Testimonial content.
To add more reviews, click Add block > Testimonial.
Click Save.

Tip: Use square photos for Avatar. They appear as small circles, so a close-up of a face works best.

Show the product each customer bought

Click the Testimonials section and make sure Show bought products is selected.
Click a Testimonial block.
Under Bought product, select a Product.
Click Save.

The product's image, title, and price appear at the bottom of the card, under a Bought product badge.

Note: The badge uses the colors set in Theme settings > Product card > Sale badge colors.

Show the reviews in a carousel or a grid

Click the Testimonials section.
Under Layout, choose Items per row on large screen.
Select Enable carousel to show the reviews in one row that customers can scroll. Clear it to show all reviews in a grid.
Optional: with the carousel on, select Show progress indicator to add a bar under the cards that shows the scroll position.
Click Save.

What customers see

Cards: each card shows the star rating, the review, and the author's photo, name, and title. If you don't add an Avatar, a placeholder image appears.
Bought product: customers click the product image or title to open the product page. When the product is on sale, the original price appears crossed out above the sale price.
Carousel on large screens: on screens 769 px and wider, previous and next arrows let customers move through the reviews. The progress indicator appears only when there are more reviews than fit in one row.
Tablets and phones: cards show 2 per row on screens from 459 px to 768 px wide, and 1 per row on smaller phones. With the carousel on, customers swipe through them.
Grid: with the carousel off, the cards wrap onto as many rows as needed.

Testimonials carousel after scrolling, with the progress indicator below the cards

Settings reference

General

Setting	What it does
Color scheme	Sets the background and text colors of the section. You can edit color schemes in Theme settings > Colors.
Section subheading	The short line above the heading. Leave it empty to hide it.
Section heading	The section title. Leave it empty to hide it.
Heading size	Sets the heading size: H2, H3, H4, or H5.
Description	Text below the heading.
Show bought products	Shows the product you select in each Testimonial block. See "Show the product each customer bought" above.

Testimonial items

Setting	What it does
Card color scheme	Sets the background and text colors of the review cards.
Show rating	Shows the stars on each card.
Rating	Sets the color of the stars.

Layout

Setting	What it does
Items per row on large screen	Shows 3, 4, or 5 cards per row on screens 769 px and wider.
Content alignment	Aligns the section heading and the text in the cards to the Left or Center.
Enable carousel	Shows the cards in one scrollable row instead of a grid.
Show progress indicator	Adds a scroll bar under the carousel. Works only when Enable carousel is selected.

Testimonial block

Setting	What it does
Avatar	The author's photo, shown as a small circle.
Rating	The number of stars, from 1 to 5.
Author	The customer's name.
Author title	A short line under the name, such as a job title or "Verified buyer".
Testimonial content	The review text.
Product	Under Bought product, the product the customer bought. Appears on the card only when Show bought products is selected.

Troubleshooting

The bought product doesn't show.
Make sure Show bought products is selected in the section settings, and that the Testimonial block has a Product selected.

The stars don't show.
Select Show rating under Testimonial items. Also check that the Rating color isn't the same as the card background.

The progress bar doesn't show.
Show progress indicator works only with Enable carousel on. The bar also hides on large screens when all reviews fit in one row.

There are no arrows on my carousel.
The arrows appear only on large screens. On tablets and phones, customers swipe.

Updated on: 02/11/2026

Was this article helpful?

Thank you!