Search Divi Plus Documentation

Search for answers or browse our knowledge base.

< All Topics
Print

Testimonial Slider

Step 1:

How to Create Testimonials

Step 2:

How to Display Testimonials

Insert DP Testimonial Slider on the page.

testimonial-slider

Content Options

Content

  1. How to select Testimonial Slider Layout: Inside the Content tab go to the Content settings >> Testimonial Layout >> select either Layout 1 / Layout 2.
    divi-testimonial-layout-type

  2. Select Number of Testimonials to display: Go to the same Content settings >> Number of Testimonials >> input your desired number.

  3. How to define Testimonial Order: Go to the Content settings >> Order >> select either DESC or ASC.

  4. Select Order Type: Go to the Content settings >> Order by >> select any from the available options that are Date, Modified Date, Title, Slug, ID, Random, and None. divi-testimonial-order-by

  5. How to Exclude or Include Testimonials of Specific Category: Go to the Content settings >> Include Categories >> Tick the checkboxes next to the categories you want to include. (If you leave all categories unchecked, it will display testimonials from all the categories.)

Display

  1. Hide Rating: Go to the Display settings >> Show Rating >> check as NO.
  2. Hide Author Image: Go to the Display settings >> Show Author Image >> check as NO.
  3. How to display Gravatar Image on Testimonial Grid: Go to the Display settings >> Use Gravatar >> check as YES. (Make sure you’ve used the author email associated with the Gravatar Account.)
  4. Hide Designation: Go to the Display settings >> Show Designation >> check as NO.
  5. Hide Company Name: Go to the Display settings >> Show Company Name >> check as NO.
testimonial-slider

Slider

  1. How to select Testimonial Slider effects: Go to the Content tab >> Slider >> Slide Effect >> choose slide effect >> Slide / Cube / Coverflow / Flip. divi-testimonial-slider-type
  2. How to define Number of Testimonials Per View: Go to the Slider Control settings >> Number of Testimonials Per View >> 1 / 2 / 3 / 4.
  3. How to Equalize Testimonials Height: Go to the Slider Control settings >> Equalize Testimonials Height >> check as YES.
  4. Enable Testimonial Slider Loop: Go to the Slider Control settings >> Enable Loop >> check as YES.
  5. Stop Slider Autoplay: Go to the Slider Control settings >> Autoplay >> check as NO.
  6. How to set Slider Autoplay Delay Time: Go to the Slider Control >> Autoplay Delay >> input the values.
  7. Disable Slider Pause On Hover: Go to the Slider Control >> Pause On Hover >> check as NO.
  8. How to set Testimonial Slider Complete Transition Duration: Go to the Slider Control >> Transition Duration >> input the values.
  9. How to show the previous & next arrow on the slider: Go to the Slider >> Show Arrows >> YES.
  10. How to select the arrow icon for the previous & next slider navigation: Go to the Slider >> Previous Arrow << choose the appropriate icon >> Next Arrow >> choose the appropriate icon.
  11. How to enable arrows only on hover: Go to the Slider Arrow >> Show Arrows On Hover >> Yes
  12. Arrows Position : This setting allows you to choose arrow position from available 8 options. By default inside selected. divi-testimonial-arrow-position-on-slider
  13. Display Pagination on the Slider and apply different styles: Go to the Slider Control >> Show Dots Pagination >> check as YES.
  14. Dots Pagination Style: After activating pagination on the slider, you can select pagination style from the Dots Pagination Style dropdown menu. Available pagination styles are Solid Dot, Transparent Dot, Stretched Dot, Line, Rounded Line, and Squared Dot.
  15. Enable Dynamic Dots: This setting will turn on and off the dynamic pagination of the slider.

Design Testimonial Slider’s Testimonials

  1. How to change Text alignment: Go to the Design tab >> Text >> Alignment >> select any available alignment options.
  2. How to apply Text Shadow: Inside the Design tab >> go to the Text settings >> Text Shadow >> apply any one from the available options.
  3. Customize Body Text of the testimonial: Go to the Design >> Body >> apply changes as required.
  4. How to style Author’s Name: Go to the Design tab >> Author >> Name >> apply text customization as required.
  5. Style Author’s Designation: Go to the Design tab >> Author >> Designation >> apply text customization as required.
  6. Style Author’s Company Name: Go to the Design tab >> Author >> Company >> apply text customization as required.
  7. How to change Star Rating size: Go to the Design tab >> Star Rating >> Star Font Size >> move the slider or input the value.
  8. How to change colors for the rated and non-rated stars: Go to the Star Rating >> Filled Star Color / Empty Star Color >> choose any required color.
  9. How to display Opening Quote Icon: Go to the Design tab >> Quote Icon >> Opening Quote Icon >> Show Opening Quote Icon >> check as YES.
  10. Change Opening Quote Icon Size: Go to the Quote Icon >> Opening Quote Icon >> Quote Icon Size >> Move the slider or input the value.
  11. Change Opening Quote Icon Color: Go to the Quote Icon >> Opening Quote Icon >> Quote Icon Color >> Choose any color as required.
  12. How to apply custom positioning for Opening Quote Icon: Go to the Quote Icon >> Opening Quote Icon >> Enable Custom Position For Quote Icon >> check as YES >> any apply customization as required.
  13. How to display Closing Quote Icon: Go to the Design tab >> Quote Icon >> Closing Quote Icon >> Show Closing Quote Icon >> check as YES.
  14. Change Closing Quote Icon Size: Go to the Quote Icon >> Closing Quote Icon >> Quote Icon Size >> Move the slider or input the value.
  15. Change Closing Quote Icon Color: Go to the Quote Icon >> Closing Quote Icon >> Quote Icon Color >> Choose any color as required.
  16. How to apply custom positioning for Closing Quote Icon: Go to the Quote Icon >> Closing Quote Icon >> Enable Custom Position For Quote Icon >> check as YES >> any apply customization as required.
  17. How to change Slider Arrows size: Go to the Design tab >> Slider >> Arrow Font Size >> Move the slider or input the value.
  18. Apply custom color on Slider Arrows: Go to the Slider settings >> Arrow Color >> choose the color as required.
  19. How to change slider pagination color: Go to the Slider settings >> Active / Inactive Dot Pagination Color >> choose colors as required.
  20. How to change Meta Separator Color: Go to the Design tab >> Meta >> apply color as required.
  21. Adds extra space to the inside of the element: Go to the Spacing >> Slider Container Padding This setting increases the distance between the edge of the element and its inner contents.
  22. Testimonial Padding: Go to the Design tab >> Spacing >> Testimonial Padding >> apply padding as required.
  23. Add Rounded Corners to Single Testimonial: Go to the Border settings >> Single Testimonial Rounded Corners >> Make changes as required.
  24. Add Borders to Single Testimonial: Go to the Border settings >> Single Testimonial Border Styles >> Make changes as required.
  25. Add Rounded Corners to Author Image: Go to the Border settings >> Author Image Rounded Corners >> Make change as required.
  26. Add Borders to Author Image: Go to the Border settings >> Author Image Border Styles >> Make change as required.
  27. Shadow on the single testimonial and element: Go to the Box Shadow settings >> Single Testimonial >> choose appropriate shadow & style >> Box Shadow >> choose appropriate shadow & style it.

Was this article helpful?
1.6 out Of 5 Stars

5 ratings

5 Stars 0%
4 Stars 20%
3 Stars 0%
2 Stars 20%
1 Stars 60%
How can we improve this article?
Please submit the reason for your vote so that we can improve the article.
Previous Team Slider
Next Testimonial Grid

Comments are closed.