FREE Divi Testimonial Slider and Tutorial

[@brunodigital5220]

Another beautifully done tutorial, Nelson! Concise, to the point and very effective. Thanks again!

[@PeeAyeCreative]

Thanks Bruno, so glad you liked it!

[@jennuinefitness]

I love this testimonial slider, suits my website so well. Thanks for sharing and your instructions were super clear and precise. Following 💪

[@PeeAyeCreative]

You are welcome, so glad to hear you like this!

[@LenoraQuincy]

I can't figure out why the slider images are not showing. Not even the default ones...

[@PeeAyeCreative]

Maybe the image URL is wrong?

[@nikarabodywhisperers]

Amazing tool ... Why is it when create more than slides the frofilr image coes out of line from the others ?

[@PeeAyeCreative]

Thank you! I'm not quite sure what you mean, but if you post your question with a link on the blog post we will try to check it.

[@TheNicy12]

Hello Nelson, once again you offer us a top class module with comprehensive explanations to set it up. Thanks for your work.

[@PeeAyeCreative]

My pleasure! Glad you like it! :)

[@denisporretti1329]

Hi Nelson! How can I change the time lapse before switching to the next testimonial?

[@PeeAyeCreative]

You can adjust that in the slider settings in the Animations toggle of the Design tab.

[@denisporretti1329]

@@PeeAyeCreative Thanks Nelson!

[@upendraadhikari6268]

Really awesome slider, just have a quick question if we can add more people pic on testinomial changing button or not?

[@PeeAyeCreative]

Yes for sure, the 4 are just an example but you can add more slides and more images to match.

[@upendraadhikari6268]

@@PeeAyeCreative thank you so much, awesome work

[@Vanessa-zw2zg]

Great! Looks pretty cool! But how can i isolte this css code so that its just used in a special section? When i use another slider anywhereelse at the same site the testimonial appears too.

[@PeeAyeCreative]

Hi Vanessa, yes to do that you just have to add a unique class to the snippet and to the module. So maybe something like "my-slider" and add that to the module Advanced tab CCS class field and then in front of every selector in the snippets.

[@scarletmendozap.4083]

Excellent resource, I really like the effect. I have no knowledge in CSS, I noticed that when I apply it it affects all the other sliders I have, how could I fix it, I don't know how to customize it or where I add it or what code to place. 🤯🤯

[@PeeAyeCreative]

You would need to add a custom CSS class to each selector to make it only affect one. We talk about that in almost every tutorial on our blog, so I recommend getting familiar with it by following some other tutorials and also read the written blog post and comments for your specific questions.

[@earnwithblessings8832]

brilliant guy with good heart to serve

[@PeeAyeCreative]

Thank you 😊

[@imrankhanlover8834]

Send me code if you don't mind

[@nixietechnology3903]

The problem is that it affects other sliders as well. Is it possible to give a CSS ID for the slider.

[@PeeAyeCreative]

Sure, you have several options, either keep the CSS on the page so that it only affects that page, or add a custom class to your slider and add that same class at the beginning of all the snippets.

[@nixietechnology3903]

@@PeeAyeCreative Thank you that worked

[@editorz6128]

@@PeeAyeCreative how can i do that? it's effecting my header slider :(, it is putting the reviews images on my header its wierd

[@nicolasfontanavideomaking]

@@nixietechnology3903 hi, can you tell me exactly what's you put in the code? I named the slider class slider-testimonial, so what Do I have to do? Please help me I really don't know how to do it thanks :(

[@nicolasfontanavideomaking]

Thank you very much for this slider. I have the same problem of the other users. I have different sliders on the page and they show me the pics of the testimonials. I undestood to add a custom class to my testimonial slider and add that same class at the beginning of all the snippets. The problem is that I really don't know what is a snippet, can you help me to understand right? Thanks :)

[@PeeAyeCreative]

Hi Nicolas, sure so basically the classes in the code are targeting the slider in general. But in order to only target one specific slider module, you need to add a custom class to the module and then match that in the code in place of the general class.

[@nicolasfontanavideomaking]

@@PeeAyeCreative Yes I understood that, but If I get the class "slider-testimonial" in my slider, wher do I have to put this name in the code? In which part of the code? Is there a specific place to put it? Sorry, thanks. You're awesome! :D

[@arthurhusken]

Hello Nelson, can you tell me where I can change the duration of each slide of the testimonial slider. Thank for this Nic solution b.t.w. Hope to hear form you. Greetz Arthur

[@emmanuelaluko7513]

Thank you for this module I'm using it currently on my site, but how do I add a 5 star rating just using the 5 start image alone... I will be glad if u can assist with this

[@PeeAyeCreative]

Hi Emmanuel, you would just need to add the image in the text, by using the button to "add media."

[@Habbit]

How do I add ratings to this? Like 1-5 stars? And the average rating of all the ratings?

[@PeeAyeCreative]

What you are asking is not specific to my layout. To do this in Divi you would need the rating system coded or something.

[@Habbit]

@@PeeAyeCreative So we can just add the ratings CSS to your CSS right?

[@PeeAyeCreative]

It would take more than CSS to have a rating system. More than likely a plugin. If you just want 5 stars you could add that with an image, but a system like you described is custom.

[@BenOrloff]

Awesome tutorial! Just what I needed for my project. Thanks so much!

[@PeeAyeCreative]

That's great, Ben! Glad it was timely!

[@michelepotter1535]

Hey there thank you for this great tutorial .. can you advise, please? I have downloaded the json file clicked upload watched the divi dots as it uploads but it doesn't appear in the module. Where would it be hiding? Thanks in advance. I have tried this 3 times but the testimonial slider is no where to be seen. ??? Thanks again.

[@PeeAyeCreative]

Hi Michele, hmm what exactly do you mean by "it doesn't appear in the module?" You tried importing it 3 times?

[@michelepotter1535]

@@PeeAyeCreative Hi and thank you so much for getting back to me, I really appreciate it. I found them! They didn't appear as yours did after uploading the code. However, later when I was scrolling down the page there they were all three. As I had tried to import 3x...

[@DaveMalonePlus]

Hi Nelson, neat slider and great tut. I would like six testimonials, so I duplicated the fourth slide twice. However, the result was that even when I added images, the two new slides do not show up. Can you please let us know specifically how to add more slides to the slider? Many thanks.

[@DaveMalonePlus]

@Mohit Rawat TY! Nelson let me know in the post to this video that after that duplication of slides, then all you have to do is basically dupe the code and add appropriate number like 4, 5, 6.

[@PeeAyeCreative]

Yes that is the correct answer.

[@kmahendran2561]

Great Guide Nelson.. i need one solution from you, i import your json file, but i have added one slider already, now ur json file image appears my slide.. how to avoid that...

[@PeeAyeCreative]

If you have more than one slider on the page then you will have to add a CSS class to the one and add the same class in the code (located in the code module of this layout).

[@mikeGietExperience]

Great one thank you ! how can I move this pictures from under the text to above it?

[@PeeAyeCreative]

You would have to really hack it up, I'm using the default slider and putting images in the default location of the dots.

[@rahul16398]

Can u please share CSS code for blur the image

[@PeeAyeCreative]

Hi Rahul, I'm not sure what you need exactly but you could look up CSS image blur and get what you need.

[@rahul16398]

Actually I want the css code for how you blur the testimonial images . Like in video one whose testimonials is not in use gets blur how you did that

[@PeeAyeCreative]

@@rahul16398 But I don't have any code for that, it is just default. You can check the tutorial for all the code I used: www.peeayecreative.com/free-divi-testimonial-slider-and-tutorial/

[@katek23]

Hi. I've tried to import this a number of times in the Divi Builder in my page layout. It says 100% once then starts again then gets stuck on 100% and it never totally imports. Any idea?

[@PeeAyeCreative]

Sorry not sure, probably something related to hosting timeout but it related her as this is the Divi Portability system.

[@binceproductions4352]

Hello great tutorial, just one question, I downloaded it and used the zip file and tried to install it in "ADD NEW PLUGINS" but it says installation failed. I tried to unzip it and import the json file in divi library and still not working, how do I install this plugin? Thanks and sorry for such a newbie question

[@PeeAyeCreative]

Please check the instructions in the blog posts. It is not a plugin 🙂

[@binceproductions4352]

@@PeeAyeCreative sorry just checking now the link of the post and I don't see how to install, please do you mind sharing how to do it. Thanks a lot

[@RandyHunt]

Another wonderful video! Nelson, I don't have the images of those that gave me the review. How can I remove the pictures? Thanks in advance :) Randy

[@PeeAyeCreative]

Hi Randy, not sure what you mean. Do you mean you do or you don't have the images? You can certainly replace them with your own in the code, is that what you are asking about?

[@marloeslive]

Supersmart, thank you so much!!

[@PeeAyeCreative]

You're welcome!

[@maverickdoctor8038]

Hello, I tried importing the JSON file on my project but it's stucked at 100%, can you help me how to fix that?

[@PeeAyeCreative]

That sounds like a server or Divi issue, not related to our content

[@kathylarosa6976]

Hello, love this template! I just have one question: how do you increase the time between transitions? I've tried increasing it by slider settings, by image...nothing seems to work. Thanks.

[@PeeAyeCreative]

Hi Kathy, that's all in the Slider module settings, so nothing to do with the template. Under Animation you can choose the speed, etc.

[@wiltonyu4951]

another great guide. Thank you

[@PeeAyeCreative]

Thank, glad you like this one!

[@seldaseker6611]

Nelson , i love your videos and ideas:-)

[@PeeAyeCreative]

Thank you Selda, I'm so happy people enjoy this! I'll keep thinking!

[@richardguzman4029]

Why mine is not working i already put the link of the picture and all i see is the original dot controller in my slider

[@PeeAyeCreative]

I don't know, I'd need to know what steps you took and a link in order to give a good answer.

[@caseychang7574]

Hi! I see that other people are having the same issues of the file showing up on other sliders on the page. I'm trying to create a custom CSS ID (or class?) for the non-testimonial slider but nothing seems to be working. I tried to follow one of your comments below and added 'my-slider' to the non-testimonial sliders but it still shows the json file. I also added a custom CSS class for the testimonial slider and added the same CSS class to the code but sadly, didn't workL:( Any tips? Thanks!

[@PeeAyeCreative]

Hi Casey, I don't think you followed the directions. I don't mention an ID anywhere and you would add the CSS class to the one you want to be the testimonial slider, not to the others. Can you try that?

[@manojshukla5462]

I subscribed but I didn't get the download link. I tried three times but the result was the same. Can you send me a link now.

[@PeeAyeCreative]

Sometimes emails go to spam. You can contact us if you still didn't get it.

[@emeraldhudson320]

i've subscribed to your list, but there's no any email that've sent me the file

[@PeeAyeCreative]

That's correct, the download link appears directly there on the blog post.

[@pakwicks]

dear how we add navigation in it

[@PeeAyeCreative]

I'm not sure what you are asking specifically about our tutorial, but the navigtion would be related to the Divi Slider module.

[@pallaviarora28]

@ Pee-Aye Creative can you please tell the code for vertical alignment like the people images appearing horizontal right now how to convert into vertical please reply asap.

[@PeeAyeCreative]

Hi Pallavi, that seems a little demanding to require me to reply asap on something free that you now want customized, doesn't it?

[@dhammikadissanayakamudiyan725]

wow great video:)

[@PeeAyeCreative]

Thank you! Cheers!

[@ehtashamali821]

Thank you so much

[@PeeAyeCreative]

You're very welcome!

[@glennrabbypaulin1853]

It's very unique, thank you for sharing...

[@PeeAyeCreative]

My pleasure 😊

[@ipixel777]

Hi Brother thanks for this. Blessings in Christ

[@PeeAyeCreative]

Same to you Chris, you are quite welcome!

[@imrankhanlover8834]

Send me code if you don't mind

[@aniket8552]

WHY IMPORT IS TAKING SO MUCH TIME...

[@PeeAyeCreative]

WHY COMMENT IS SO ABOUT DIVI AND HOSTING AND NOT MY VIDEO

[@kasunramesh9426]

Layer

[@PeeAyeCreative]

?