Testimonial slider
A Carrd demo slider for customer testimonials.
Customer testimonials
Jane Doe
Growth Hacker
This Carrd plugin just works. Exactly what I needed for my SaaS marketing page. Thank you!
John Hancock
Front End Developer
I wanted a testimonial slider for my Carrd website but didn't want to fuss around with the containers and settings to make one. This plug-and-play Carrd plugin allows me to just copy and paste, edit some text and I'm done.
Mary Appleseed
Entrepreneur
I know some basic HTML and CSS, and that's all I needed to customize this testimonial slider for my Carrd site. Love it!
See the plugin in action on real websites made by customers of this plugin:Personal CV
Jewelry product slider (on mobile)
Consulting services
📣 New Carrd plugin released: Mega nav bar
Made by @jasonleowsg using Bootstrap.
Double testimonial slider
A Carrd demo for a double slider for customer testimonials.
Jane Doe
Growth Hacker
This Carrd plugin just works. Exactly what I needed for my SaaS marketing page. Thank you!
John Hancock
Front End Developer
I wanted a testimonial slider for my Carrd website but didn't want to fuss around with the containers and settings to make one. This plug-and-play Carrd plugin allows me to just copy and paste, edit some text and I'm done.
Mary Appleseed
Entrepreneur
I know some basic HTML and CSS, and that's all I needed to customize this testimonial slider for my Carrd site. Love it!
Jane Doe
Growth Hacker
This Carrd plugin just works. Exactly what I needed for my SaaS marketing page. Thank you!
John Hancock
Front End Developer
I wanted a testimonial slider for my Carrd website but didn't want to fuss around with the containers and settings to make one. This plug-and-play Carrd plugin allows me to just copy and paste, edit some text and I'm done.
Mary Appleseed
Entrepreneur
I know some basic HTML and CSS, and that's all I needed to customize this testimonial slider for my Carrd site. Love it!
Tutorial on how to update the code to have 2 sliders here.
Made by @jasonleowsg using Bootstrap.
double slider tutorial
1. Go to the Embed element containing the testimonial slider code, find the body tag and find this code:<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">2. Change the id to carouselExampleIndicators2:<div id="carouselExampleIndicators2" class="carousel slide" data-ride="carousel">3. Scroll down a bit and find this code for the indicators:<!-- Indicators-->4. Change the
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>data-target to what you used for the id in step #2, while keeping the prefix #:<!-- Indicators-->5. Scroll down some more and find this code for the carousel controls:
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators2" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators2" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators2" data-slide-to="2"></li>
</ol><a class="carousel-control-prev control" data-target="#carouselExampleIndicators" role="button" data-slide="prev">6. Change the
<span class="fa fa-angle-left icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next control" data-target="#carouselExampleIndicators" role="button" data-slide="next">
<span class="fa fa-angle-right icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>data-target to what you used for the id in step #2, while keeping the prefix #:<a class="carousel-control-prev control" data-target="#carouselExampleIndicators2" role="button" data-slide="prev">6. Done! 👍
<span class="fa fa-angle-left icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next control" data-target="#carouselExampleIndicators2" role="button" data-slide="next">
<span class="fa fa-angle-right icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>