Staaarter

Education Social Proof

Social proof section displaying key stats (rating, enrollment number, completion rate) alongside one featured student testimonial with quote, name, program, and portrait. Perfect for course landing pages.

By Staaarter Team
Education
Docs
Live preview

Docs

Installation

A real shadcn registry command, not a copy-paste stand-in: it fetches this block plus its avatar, avatar-initials dependencies and any missing npm packages, and installs them straight into your project.

npx shadcn add https://staaarter.com/r/education-social-proof.json

Prefer not to use the CLI? Copy the source from the Code toggle above into src/components/blocks/education/education6.tsx instead.

Usage

The file also exports education6Demo, the exact props behind the preview above. Spread it to get a working section in one line, then replace it with your own data.

import { Education6, education6Demo } from "@/components/blocks/education/education6";

export default function Page() {
  return <Education6 {...education6Demo} />;
}

Props

PropTypeDefaultDescription
eyebrowstringnoneSmall uppercase label above the heading; only rendered when set.
headingReactNodenoneSection heading above the stats and testimonial row.
statsProofStat[]noneStat items rendered inline to the left of the testimonial card.
testimonialStudentTestimonialnoneSingle featured testimonial card.
classNamestringnoneExtra classes for the outer section element.

Types

type ProofStat = { value: string; label: string };

type StudentTestimonial = {
  quote: string;
  name: string;
  program: string;
  avatar?: { src: string; alt: string };
};

Behavior notes

  • stats renders as a wrapping inline row, not a grid, so 2 to 5 stats all lay out cleanly without empty cells.
  • Only a single testimonial is supported per block instance; there is no carousel or rotation logic for multiple testimonials.
  • testimonial.avatar falls back to initials built from the first letter of up to two space-separated words in testimonial.name when no avatar image is supplied.
  • This is a static display section; stats and the testimonial are illustrative copy, not pulled from any live analytics source.