Testimonials 02

File: src/blocks/testimonials/Testimonials02.astro

Carousel of testimonial cards with configurable slides-per-view and arrow placement.

Config (blocks.ts → testimonialsSlider)

testimonialsSlider: {
    width: "standard",
    heading: "What clients say",
    subheading: "Swipe through more feedback from recent projects.",
    slidesPerView: 1,
    slidesPerViewMd: 2,
    slidesPerViewLg: 3,
    arrowPosition: "header",
    gap: 24,
    items: [
      {
        quote:
          "Delivered ahead of schedule with zero hand-holding. The site scores 98 on Lighthouse and our bounce rate dropped 30%.",
        name: "Sarah Chen",
        role: "Founder, Northline Studio",
        initials: "SC",
        image: photos.karla,
        imageAlt: "Sarah Chen",
      },
      {
        quote:
          "Finally a developer who speaks design. Every component was thoughtful, documented, and easy for us to extend.",
        name: "Marcus Webb",
        role: "Creative Director, Form & Field",
        initials: "MW",
        image: photos.edgar,
        imageAlt: "Marcus Webb",
      },
      {
        quote:
          "Our Sanity + Astro rebuild cut hosting costs in half and made content updates painless for the whole team.",
        name: "Elena Ruiz",
        role: "Head of Marketing, Scalepath",
        initials: "ER",
      },
      {
        quote:
          "Delivered ahead of schedule with zero hand-holding. The site scores 98 on Lighthouse and our bounce rate dropped 30%.",
        name: "Sarah Chen",
        role: "Founder, Northline Studio",
        initials: "SC",
        image: photos.karla,
        imageAlt: "Sarah Chen",
      },
      {
        quote:
          "Finally a developer who speaks design. Every component was thoughtful, documented, and easy for us to extend.",
        name: "Marcus Webb",
        role: "Creative Director, Form & Field",
        initials: "MW",
        image: photos.edgar,
        imageAlt: "Marcus Webb",
      },
      {
        quote:
          "Our Sanity + Astro rebuild cut hosting costs in half and made content updates painless for the whole team.",
        name: "Elena Ruiz",
        role: "Head of Marketing, Scalepath",
        initials: "ER",
      },
    ],
  },

Add to a page

---
import Testimonials02 from "@/blocks/testimonials/Testimonials02.astro";
---

<Testimonials02 />

Props override matching keys from config:

<Testimonials02
  heading="Custom headline"
/>

Props

Also include: TestimonialCard.astro, TestimonialSliderArrows.astro.

← Testimonials versions · Blocks overview