How To Create Testimonial Slider Using Divi Theme

The Divi Testimonial Slider Module provides a dynamic, interactive way to showcase customer reviews on your website.

It allows you to create an engaging testimonial slideshow, highlighting each customer review with their photo, quote, star rating, and company details.

The slider can automatically cycle through testimonials or be controlled manually with touch swipes, navigation arrows, and pagination dots—making it ideal for homepages, landing pages, and sales channels.

Every element is fully customizable: adjust colors, fonts, spacing, slide transitions, and layout order to match your brand’s unique styling.

Pre-Requisites

• A WordPress Website
• Divi Theme
• Divi Testimonial Plus Plugin

Testimonial Management - Add & Edit

1. Testimonial Management refers to the simple process of adding, editing, and organizing customer reviews in your WordPress dashboard.

2. It involves collecting feedback from customers, reviewing ratings, and formatting testimonials for display on your site.

3. For step-by-step instructions, refer to How To Manage Testimonials In Your WordPress Website.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Add “Testimonial Slider Divi Module” On A Page

1. Once you have saved customer testimonials in your WordPress admin panel, you can showcase them anywhere on your website using a responsive slider.

2. To add a testimonial slider to your page:

   • Open or edit a page in the Divi Visual Builder.
   • Inside a Divi row, click the plus icon to Add New Module.
   • Search for Testimonial Slider, then click to add the Divi module.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Testimonial Filter Settings (Content Tab) - Divi Testimonial Slider

1. Filtering testimonials allows you to display specific, highly relevant reviews on targeted pages rather than showing every review at once.

2. To set up testimonial filtering:

   • In the Testimonial Slider Divi module, go to the Content tab.
   • Click on Testimonials Filter. Available options include:
     • Fetch Testimonials From - Choose which page reviews are pulled from:
       • Current Page - Displays testimonials specifically linked to the page currently being viewed.
       • Custom Pages - Displays testimonials linked to one or more selected pages.
         • Custom Page IDs - Enter comma-separated page IDs for your selected pages.
       • Filter By Categories - Toggle YES to display testimonials assigned to specific categories.
         • Categories - Select one or more category checkboxes.
       • Assigned Users - Limit testimonials to those linked to specific user accounts (enter comma-separated user IDs).
       • Minimum Star Rating - Filter testimonials so only reviews meeting a minimum rating (e.g., 4 or 5 stars) are displayed.
       • Number of Reviews To Display - Set the maximum number of testimonials to include in the slider carousel.
       • Skip Testimonials - Offset - Skip a specified number of initial testimonials.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Slider Settings (Content Tab) - Divi Testimonial Slider

1. Customize slideshow playback and movement controls to customize how your testimonial carousel operates:

   • In the Testimonial Slider Divi module, go to the Content tab.
   • Click on Slider Settings:
     • Effect - Choose a visual transition style:
       • Slide - Smooth horizontal sliding motion.
       • Coverflow - 3D card rotation effect with realistic depth.
         • Enable Coverflow Slide Shadow - Toggle YES to add drop shadows to 3D slides.
           • Shadow Color - Set custom shadow colors.
         • Coverflow Rotate & Depth - Adjust slide rotation angle and 3D perspective depth.
     • Slides Per View - Set how many testimonial cards are visible at once (with responsive controls for Desktop, Tablet, and Mobile).
     • Space Between Slides - Adjust spacing (in pixels) between visible slides.
     • Initial Slide - Choose which slide displays first when the page loads.
     • Centered Slide - Toggle YES to center-align the active slide.
     • Enable Loop - Toggle YES to enable continuous infinite looping.
     • Autoplay - Toggle YES to automatically advance slides:
       • Autoplay Delay - Set the delay (in milliseconds) between automatic slide transitions.
       • Pause On Hover - Toggle YES to pause slideshow rotation when visitors hover over a slide.
     • Transition Duration - Set slide transition speed.
     • Show Arrows - Toggle YES to display previous/next navigation arrows:
       • Arrows On Hover - Show navigation arrows only when visitors hover over the slider.
     • Show Dots Pagination - Toggle YES to display pagination dot indicators.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Content Toggles Settings (Content Tab) - Divi Testimonial Slider

1. Each testimonial slide can display key details, including:

   • Title
   • Quote Content
   • Author Photo / Avatar
   • Author Name & Company
   • Assigned Page Links
   • Publication Date
   • Star Rating

2. You can easily choose which details to show or hide:

   • In the Testimonial Slider Divi module, go to the Content tab.
   • Click on Content Toggle.
   • Use YES/NO toggle switches to show or hide any testimonial element.
   • Fallback Text - Enter a custom message to display if no testimonials match your filter criteria.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

SEO Schema Settings (Content Tab) - Divi Testimonial Slider

1. Our plugin includes built-in Review Schema, which automatically formats your customer reviews and star ratings into structured data. This helps search engines like Google display eye-catching review star snippets directly in search results.

2. To enable Google Review Schema:

   • In the Testimonial Slider Divi module, go to the Content tab.
   • Click on SEO Schema.
   • Set Include SEO Schema? to YES.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Testimonials Settings (Design Tab) - Divi Testimonial Slider

1. To customize outer container spacing for the slider section:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Testimonials:
     • Margin - Adjust outer margins around the slider container.
     • Padding - Adjust inner padding inside the slider container.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Testimonial Settings (Design Tab) - Divi Testimonial Slider

1. To style individual testimonial cards within the slider:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Testimonials:
     • Layout - Choose how elements inside each card are arranged:
       • Flexbox Column - Stacks elements neatly in a flexible vertical list.
       • Grid - Arranges internal elements using an advanced grid layout.
     • Background - Apply background colors, gradients, or custom images to slides.
     • Justify Content - Align card contents to the left, center, or right.
     • Padding - Adjust internal padding inside each testimonial slide.
     • Rounded Corners - Set corner curvature for testimonial slides.
     • Border Styles - Customize border thickness, color, and styles for individual slides.
     • Box Shadow - Apply drop shadows to give slides depth.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Testimonial Item Flexbox Settings (Design Tab) - Divi Testimonial Slider

1. When Layout is set to Flexbox Column, elements inside each testimonial card are organized in a clean vertical stack.

2. Learn more about layout flexible formatting concepts at the MDN Web Docs Flexbox Guide.

3. To customize vertical display order in flex layout:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Testimonial Item Flexbox.
   • Change the vertical layout order of testimonial slide elements (such as placing stars above the title or author name below the quote):
     • Title
     • Star Rating
     • Date
     • Assigned Page Links
     • Quote Content
     • Author Photo / Avatar
     • Author Name

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Testimonial Item Grid Settings (Design Tab) - Divi Testimonial Slider

1. When Layout is set to Grid, elements inside each testimonial slide are positioned using custom grid coordinates.

2. Learn more about advanced grid arrangements at the MDN Web Docs Grid Guide.

3. To customize element positioning in grid layout:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Testimonial Item Grid:
     • Grid Column - Define column layouts for desktop, tablet, and mobile displays.
     • Column Gap & Row Gap - Adjust spacing between internal grid items.
     • Title Row & Column Positioning - Position the title across specific grid rows and columns.
     • Assigned Links Positioning - Set row and column placement for page links.
     • Stars Positioning - Position the star rating container.
     • Date Positioning - Set placement for the testimonial date.
     • Content Positioning - Set row and column placement for the main quote text.
     • Avatar Positioning - Set row and column placement for the author photo.
     • Author Positioning - Position the author name and company details.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Beginning Quote Icon Settings (Design Tab) - Divi Testimonial Slider

1. The beginning quote icon appears at the start of your testimonial text to highlight customer quotes.

2. To customize the opening quote icon:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Beginning Quote Icon:
     • Show Icon - Toggle YES to display an opening quote mark.
       • Icon - Choose an icon style.
       • Size - Set icon size (with responsive controls for Desktop, Tablet, and Mobile).
       • Icon Color & Background Color - Customize icon and background colors.
       • Align - Align the quote icon to the left, center, or right.
       • Margin & Padding - Adjust outer and inner spacing around the icon.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Ending Quote Icon Settings (Design Tab) - Divi Testimonial Slider

1. The ending quote icon appears at the conclusion of your testimonial text.

2. To customize the closing quote icon:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Ending Quote Icon:
     • Show Icon - Toggle YES to display a closing quote mark.
       • Icon - Choose an icon style.
       • Size - Set icon size.
       • Icon Color & Background Color - Customize icon and background colors.
       • Align - Align the quote icon to the left, center, or right.
       • Margin & Padding - Adjust outer and inner spacing around the icon.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Title Settings (Design Tab) - Divi Testimonial Slider

1. To style testimonial slide titles:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Title:
     • Margin & Padding - Adjust spacing around titles.
     • Typography options:
       • Title Font & Weight
       • Title Style & Alignment
       • Title Color & Font Size
       • Letter Spacing & Line Height
       • Text Shadow Effects

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Date Settings (Design Tab) - Divi Testimonial Slider

1. To style testimonial dates:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Date:
     • Margin & Padding - Adjust spacing around dates.
     • Typography options:
       • Date Font & Weight
       • Date Style & Alignment
       • Date Color & Font Size
       • Letter Spacing & Line Height
       • Text Shadow Effects

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Assigned Links Settings (Design Tab) - Divi Testimonial Slider

1. To style page links assigned to testimonials:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Assigned Links:
     • Margin & Padding - Adjust spacing around page links.
     • Typography options:
       • Link Font & Weight
       • Link Style & Alignment
       • Link Color & Font Size
       • Letter Spacing & Line Height
       • Text Shadow Effects

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Content Settings (Design Tab) - Divi Testimonial Slider

1. To style main testimonial quote text:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Content:
     • Background - Set background colors or gradients behind quote text.
     • Margin & Padding - Adjust spacing around quote text.
     • Typography options:
       • Content Font & Weight
       • Text Alignment & Color
       • Font Size, Letter Spacing & Line Height
       • Text Shadow Effects
     • Borders & Corner Radius - Customize content container borders and rounded corners.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Avatar Image Settings (Design Tab) - Divi Testimonial Slider

1. To style customer photos and avatars:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Avatar Image:
     • Size - Set photo dimensions (with responsive controls for Desktop, Tablet, and Mobile).
     • Align - Align photos to the left, center, or right.
     • Margin & Padding - Adjust spacing around photo containers.
     • Rounded Corners - Adjust corner radius (e.g., set to 50% for circular photos).
     • Borders - Configure custom border thickness, colors, and styles around photos.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Author Name Settings (Design Tab) - Divi Testimonial Slider

1. To style author names and company details:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Author Name:
     • Margin & Padding - Adjust spacing around author text.
     • Typography options:
       • Author Font & Weight
       • Text Alignment & Color
       • Font Size, Letter Spacing & Line Height
       • Text Shadow Effects

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Rating Stars Settings (Design Tab) - Divi Testimonial Slider

1. To style review star ratings:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Rating Stars:
     • Color - Choose a custom color for rating stars (e.g., gold or brand blue).
     • Size - Set star dimensions.
     • Align - Align star ratings to the left, center, or right.
     • Margin & Padding - Adjust spacing around star rating containers.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Arrow Navigation Settings (Design Tab) - Divi Testimonial Slider

1. To style previous and next arrow buttons:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Arrow Navigation:
     • Background - Set background colors, gradients, or custom styling behind arrows.
     • Previous Arrow Margin & Padding - Adjust outer and inner spacing for the “Previous” arrow button.
     • Next Arrow Margin & Padding - Adjust outer and inner spacing for the “Next” arrow button.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Dot Navigation Settings (Design Tab) - Divi Testimonial Slider

1. To style pagination dot navigation indicators:

   • In the Testimonial Slider Divi module, go to the Design tab.
   • Click on Dot Navigation:
     • Dot Pagination - Align dot navigation controls to the left, center, or right.
     • Change Active Dot Dimensions - Toggle YES to give the active slide dot custom dimensions (ideal for highlighting current slide position).
       • Active Dot Width & Height - Set custom dimensions for the active dot indicator.
     • Active & Inactive Dot Colors - Customize active and inactive dot colors.
     • Dot Border Radius - Set corner curvature for dots.
     • Dot Width & Height - Set default dot dimensions.
     • Gaps Between Dots - Adjust spacing between individual dots.
     • Margin & Padding - Adjust spacing around the dot navigation container.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Custom CSS (Advanced Tab) - Divi Testimonial Slider

1. Add custom CSS rules to gain fine-grained design control over individual elements within the testimonial slider:

   • In the Testimonial Slider Divi module, go to the Advanced tab.
   • Click on Custom CSS.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial