How to Add a Testimonial Carousel to Your Shopify Store (ZHD Testimonial Section)

Customer testimonials build trust, improve conversions, and make your store look professional. In this tutorial, we’ll create a Shopify Testimonial Carousel Section using Swiper.js to make it interactive, responsive, and automatic.

Step 1: Create a New Section

Go to your Shopify Admin → Online Store → Themes → Edit Code → Sections → Add a new section. Name it zhd-testimonial-carousel.liquid.

Paste This Code:

  

    

      {% raw %}{% for block in section.blocks %}{% endraw %}
        

          
★★★★★
          {% raw %}{% if block.settings.client_image %}{% endraw %}
            
          {% raw %}{% endif %}{% endraw %}
          
"{% raw %}{{ block.settings.testimonial_text }}{% endraw %}"
          
- {% raw %}{{ block.settings.client_name }}{% endraw %}
        
      {% raw %}{% endfor %}{% endraw %}
    

    
    

    

    
    

  




{% raw %}{% schema %}{% endraw %}
{
  "name": "ZHD Testimonial Carousel",
  "tag": "section",
  "class": "testimonial-carousel-section",
  "max_blocks": 15,
  "settings": [],
  "blocks": [
    {
      "type": "testimonial",
      "name": "Testimonial",
      "settings": [
        {
          "type": "text",
          "id": "testimonial_text",
          "label": "Testimonial",
          "default": "This is a sample testimonial text."
        },
        {
          "type": "text",
          "id": "client_name",
          "label": "Client Name",
          "default": "Jane Doe"
        },
        {
          "type": "image_picker",
          "id": "client_image",
          "label": "Client Image"
        }
      ]
    }
  ],
  "presets": [
    {
      "name": "ZHD Testimonial Carousel",
      "category": "Testimonials",
      "blocks": [
        { "type": "testimonial" },
        { "type": "testimonial" },
        { "type": "testimonial" }
      ]
    }
  ]
}
{% raw %}{% endschema %}{% endraw %}

Step 2: Add Swiper.js to Your Theme

If your theme doesn’t already include Swiper, add the following CDN links to your theme.liquid inside the tag:

Step 3: Customize in Theme Editor

In your Shopify theme editor, click Add Section → ZHD Testimonial Carousel. Add up to 15 testimonials — each with:

• ⭐ A client quote
• 👤 Client name
• 🖼️ Optional profile image

Step 4: Optional Tweaks

You can adjust the autoplay delay or remove arrows by editing the JS section. For example:

autoplay: {
  delay: 4000, // changes slide every 4s
  disableOnInteraction: false,
}

🎉 Final Thoughts

Adding testimonials is one of the easiest ways to build customer trust. This ZHD Testimonial Carousel is light, mobile-friendly, and uses Shopify’s native section system — perfect for boosting credibility without slowing your site.

Written by Zahidul Islam | Shopify Custom Design Tutorials