Introduction

When it comes to Divi, the sliders are also a cool option for those who want some fancy-looking page or post with an extra feature that is not only trendy but also necessary, such as testimonials that every website needs. However, there is no testimonial slider module built into Divi; consequently, the “DiviNationKit” plugin fills this gap with a simple, full-featured solution. In this tutorial, I will explaining how to create a responsive testimonial slider with the free WordPress plugin.

Why Use a Testimonial Slider?

Providing testimonials in sliders make you more credible and increase your trust level to the new customers. They provide interactive visual testimonials of happy clients. This is why it can make a huge difference in conversion rates and engagement of your website.

Step-by-Step Guide to Creating a Testimonial Slider

We will go through step by step on how to design a awesome Testimonial Slider using Divi and DiviNationKit Divi Extension for free.

Here you will find all the demo design with DiviNationKit you can download and use it on your website. Preview Demo

Install the DiviNationKit Plugin

To get started, you need to install and activate the “DiviNationKit” plugin.

• Go to your WordPress dashboard.
• Navigate to Plugins > Add New.
• Search for “DiviNationKit”.
• Click on “Install Now” and then activate the plugin.

Adding a Testimonial Slider Module

Once the plugin is activated, follow these steps to add the testimonial slider module:

• Open the page where you want to add the testimonial slider in the Divi Builder.
• Click on the “Add New Module” button.
• Select the “Testimonial Slider” module from the list.

Customizing Content

The content tab allows you to add and customize the text and media for each testimonial.

• Name: Enter the client’s name.
• Position: Add the client’s position or title.
• Description: Write the testimonial text.
• Image: Upload the client’s image.
• Rating Settings: Set the rating for the testimonial if needed.

You can add multiple slides by clicking on the “+” icon and repeating the above steps for each testimonial.

Configuring Slider Settings

Next, configure the slider’s behavior and appearance.

• Space Between Sliders: Adjust the spacing between slides.
• Autoplay: Enable or disable autoplay.
• Loop: Set the slider to loop continuously.
• Speed: Control the transition speed between slides.
• RTL: Enable right-to-left sliding if your site uses RTL languages.
• Slide to Show/Scroll: Choose how many slides to show at once and how many to scroll. For now we will use 2 item to display at a time

Designing the Slider

Select the item, scroll down on the background tab set background color of the slider

The design tab offers several customization options for making your slider visually appealing.

Layouts

Layout Style: Style 1

Now Back to Testimonial slider settings.

Navigate Design Tab > Navigation > Dots

Dots color: #ffffff

Active Dot Color: #01564d

Dots Size: 10px

Testimonial texts:

Author Image Settings:

• Space Between image and author info: 20px
• Image size: 50px
• Rounded Corner: 100px

Rating Settings:

Slider Item Settings:

Custom Spacing:

• Keep as default
• Rating Margin top: 5px
• Content Wrapper Padding top: 20px

Final Adjustments

Once you’ve configured the settings and design, preview your testimonial slider to ensure it looks perfect on all devices. Make any final adjustments as needed.

• Check responsiveness: Use Divi’s responsive design preview to see how your slider looks on mobile and tablet devices.
• Save your changes: Once satisfied, save the module settings and publish the page.

Conclusion

Creating a testimonial slider in Divi is straightforward with the “DiviNationKit” plugin. By following this guide, you can design a custom slider that enhances your site’s credibility and user engagement. The plugin offers various customization options and layouts, making it easy to match the slider to your site’s overall design.

Start showcasing your client testimonials in a stylish and responsive slider today!