Social Post Style Cards
Testimonial cards styled like social media posts: avatar and handle in the header, the quote as the post body, and a decorative footer row of like/repeat/comment counts. Good for a section that wants the informal, screenshot-of-a-tweet feel without embedding real third-party posts.
More Testimonials Blocks
View all →Single Large Quote
One large centered pull-quote with a decorative quote mark and a simple avatar attribution below.
Three Column Grid
Responsive grid of quote cards, each with a star rating, avatar, name, role, and quote text.
Quote Carousel
Interactive one-at-a-time quote carousel with prev/next arrows and clickable dot indicators.
Video Testimonial Grid
Grid of video-style testimonial cards, each a 16:9 thumbnail with a play-button overlay and a caption.
Masonry Wall
"Wall of love" style masonry layout of many short quote cards using CSS columns, not a JS library.
Quote With Stats Sidebar
Split layout pairing a large quote and attribution with a sidebar of 2-3 result stats.
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/social-post-style-cards.jsonPrefer not to use the CLI? Copy the source from the Code toggle above into
src/components/blocks/testimonials/testimonial8.tsxinstead.Usage
The file also exports testimonial8Demo, the exact props behind the preview above. Spread it to get a working section in one line, then replace it with your own data.
Props
Types
Behavior notes