Skip to content

Native Divi 5 ModuleFree

Divi Testimonial Card

Showcase reviews and quotes to build trust.

Why use the Divi Testimonial Card module?

A single quote on a page does more work than a wall of them, and it is the thing most Divi layouts end up faking: a blurb module with the icon switched off, a star rating pieced together from unicode characters, and an avatar that crops square when it should be round.

The Testimonial Card is one module for one quote. The reviewer, the role, the photo, the star rating and the quote mark are all fields, and where each of them sits is a setting rather than a stylesheet.

The card beside this is the live module, running the Bubble design.

Five layout settings decide where the photo, the reviewer and the rating sit. Nothing here needs custom CSS.

Marketing Lead

Membership site

What you get out of it

Two designs, one dropdownNormal, or a Bubble with its own background, radius and a pointer whose colour, side and position you set.Star ratings built inOne to five stars, with the size, colour and spacing set on the card. No unicode characters pasted into a text field.Five places for the photoTop, left, right, absolute, or beside the reviewer name. The reviewer block itself moves above or below the quote.The quote mark is a real elementFive built-in marks or your own image, placed inline, absolutely in any corner, or dropped behind the text as a watermark.Typography per elementThe name, the role and the review each have their own font group, and the review and role take rich text.Free, and native on Divi 5It ships in Divi Torque Lite on WordPress.org and in Divi Torque Pro, and Divi 4 layouts convert across.

Everything the Divi Testimonial Card module does

Every option below ships in the free plugin, and in Divi Torque Pro.

Review design: Normal or BubbleRich text review and roleReviewer name, role and photoPhoto position: top, left, right, absolute or beside the reviewerReviewer block above or below the quoteRating position: default, bottom or beside the reviewerStar rating, 1 to 5Star size, colour and spacingFive built-in quote marksOr upload your own quote imageQuote placement: inline, absolute or behind the textAbsolute quote in any of four corners, with X and Y offsetsQuote colour, size and opacityContent alignment: left, centre or rightBubble background, padding and radiusBubble arrow colour, side and positionPhoto width, height, border and radiusSeparate typography for name, role and reviewA personal website and a company linkOpen links in a new tabCustom CSS hooks for eight parts of the card

See the Divi Testimonial Card in action

Every card below is the live module, not a picture of one. The two designs are the first thing to choose between.

Design · Normal

The quote sits directly on the section with no box around it.

Design Lead

Divi freelancer

Normal keeps the card flat, so it inherits whatever surface the section already has.

Design · Bubble

The quote goes in a box with a pointer. Colour, side and position are all settings.

Bubble wraps the review in its own box and adds a pointer down to the reviewer.

Agency Owner

WordPress studio

Where the photo goes

Five options, and none of them ask you to rebuild the card. These are three of them.

Photo · Top

Above everything, with the reviewer underneath.

Top puts the photo above the quote and centres the whole card nicely.

Front-end Developer

Theme shop

Photo · Left

Beside the card, with the text to its right.

Studio Founder

Design agency

Left floats the photo out beside the review instead of above it.

Photo · Beside the reviewer

The default. It sits with the name and role.

Relative keeps the photo with the name and role, which is the default.

Support Engineer

Online store

Reviewer on top, or underneath

The reviewer block and the rating each have their own position setting, so the reading order is yours.

Reviewer first

Name, role and rating, then the quote.

Marketing Lead

Membership site

Reviewer at the top reads as an endorsement: you know who is speaking before they speak.

Quote first

The quote leads and the reviewer signs it off.

Reviewer at the bottom reads as a pull quote, with the attribution underneath.

Design Lead

Divi freelancer

No rating at all

One toggle removes the stars.

Use Rating is a toggle, so a quote that does not need stars simply does not have them.

Front-end Developer

Theme shop

The quote mark

Five marks, and three ways to place one. Behind the text is the default placement.

Behind the text

A watermark at low opacity, sitting under the review.

Background placement drops the mark behind the text at whatever opacity you choose. Keep it large and faint and it reads as texture rather than as an element competing with the words.

Agency Owner

WordPress studio

Inline, above the quote

Default placement puts it in the flow.

Default placement keeps the mark in the flow, above the review and aligned with it.

Studio Founder

Design agency

Absolute, top right

Any of four corners, with X and Y offsets.

Absolute pins the mark to a corner, and the offsets move it from there.

Support Engineer

Online store

Alignment, and the bubble arrow

Content alignment moves the whole card. On a Bubble, the pointer takes its own side and position.

Centred

Alignment set to centre, photo on top.

Centre suits a single card sitting on its own under a heading.

Marketing Lead

Membership site

Bubble · arrow left

The pointer sits 26px from the left edge.

Arrow placement is left, right or centre, and the position moves it along that edge.

Front-end Developer

Theme shop

Bubble · arrow centre

Same card, pointer centred under the box.

The bubble background, padding, radius and arrow colour are separate settings.

Studio Founder

Design agency

Building one takes about a minute

Three steps, and none of them involve custom CSS.

1Drop in the moduleAdd Testimonial Card to any row. It arrives with a review, a reviewer and a rating already filled in.2Write the quoteThe review and the role take rich text. Add the reviewer name, a photo, and a rating from one to five.3Place the partsChoose Normal or Bubble, then decide where the photo, the reviewer block and the rating sit.

Questions people ask first

Short answers, all of them checked against what the module actually does.

Is the Testimonial Card free?Yes. It ships in Divi Torque Lite on WordPress.org, and in Divi Torque Pro. Nothing on this page is behind the paid plugin.Can one module hold several testimonials?No. This module is one card for one quote. For a set that rotates, use the Testimonial Slider in Divi Torque Pro, which is the same card design with a carousel around it.Why is there no quote mark on my card?The quote mark is hidden by default. The setting is called Hide Quote Icon, and it starts switched on, so turn it off to show the mark.Can I use half stars?No. The rating is a whole number from one to five. For a 4.5 you would need to say so in the review text.Does it have a verified badge or a Google badge?No. Those belong to the Testimonial Slider in Divi Torque Pro. This module has the reviewer, the role, the photo and the rating.Does it need Divi 5?It is a native Divi 5 module, built on the Divi 5 engine rather than shimmed from Divi 4. Layouts built with the Divi 4 version convert across.

Get Testimonial Card and 78 more.

One license, every module and extension, native on Divi 5.