How to Display Testimonials on Your Website

Why Placement and Design Matter

Collecting great testimonials is only half the battle. How you display them on your website determines whether they actually influence buying decisions. A poorly placed or badly designed testimonial section can be completely ignored by visitors — or worse, look untrustworthy.

This guide covers the best layouts, embed methods, design principles, and common mistakes to avoid when displaying testimonials on your website.

Layout Options

1. Grid Layout

A grid of testimonial cards works well when you have 4-12 testimonials of similar length. Each card shows the quote, the customer's name, and optionally their photo and company. Grids are scannable and work well on both desktop and mobile.

Best for: Dedicated testimonial sections, landing pages with space for social proof.

2. Carousel / Slider

Carousels let you show many testimonials in a small space. They work well when you want to feature testimonials without taking up too much vertical space. However, auto-rotating carousels can be annoying — let users control the navigation.

Best for: Homepages where vertical space is limited, above-the-fold placements.

3. Marquee / Scrolling Wall

A continuously scrolling "wall of love" creates a sense of abundance. It signals that you have so many happy customers, you can't even fit them all on screen. This works best when you have 15+ testimonials.

Best for: Creating a "wow" factor, showcasing volume of happy customers.

4. Inline Quotes

Instead of grouping all testimonials in one section, place individual quotes next to the features or benefits they reference. A testimonial about easy setup goes next to your onboarding section. A quote about ROI goes near your pricing.

Best for: Feature pages, pricing pages, anywhere you want to address specific objections.

5. Featured / Hero Testimonial

A single, powerful testimonial displayed prominently with a large photo, the full quote, and context about the customer. This format gives maximum impact to your strongest testimonial.

Best for: Above-the-fold on landing pages, next to CTAs.

Embed Methods

Manual HTML

You can always build your testimonial section by hand with HTML and CSS. This gives you complete control but means you have to update the code every time you add a new testimonial. For a handful of static testimonials, this is fine.

Third-Party Widgets

Tools like Trustfolio provide embed codes that automatically display your latest testimonials. The advantage is that you add new testimonials through a dashboard and they appear on your site without code changes.

The key consideration here is performance. Many testimonial widgets load 200-500KB of JavaScript, which can significantly slow your page. Trustfolio's widget is under 5KB — it loads as fast as static HTML while still being dynamically updated from your dashboard.

API Integration

If you want full control over the design but still want dynamic data, use an API. Fetch testimonials at build time (for static sites) or on the server (for dynamic sites) and render them with your own components. This is the most flexible approach but requires development time.

Design Tips for Maximum Impact

• Use real photos: Testimonials with headshots are 35% more effective than those without. Stock photos have the opposite effect — they make everything look fake.
• Keep it readable: Use a legible font size (16px+), adequate line height, and enough contrast. If people can't easily read the testimonial, it doesn't exist.
• Highlight key phrases: Bold the most impactful part of each testimonial. Many visitors scan rather than read, so make the key message stand out.
• Show context: Name, title, company, and ideally a link to their website. The more verifiable the source, the more trusted the testimonial.
• Don't over-design: Simple cards with clean typography work better than elaborate designs with shadows, gradients, and animations. The focus should be on the words, not the decoration.
• Star ratings help: If applicable, showing a 5-star rating alongside the text testimonial adds an at-a-glance quality signal.

Common Mistakes to Avoid

1. Hiding Testimonials on a Separate Page

A "/testimonials" page that nobody visits is a waste. Place your best testimonials on your homepage, pricing page, and sign-up page — wherever visitors make decisions.

2. Using Only Generic Praise

"Amazing product!" tells visitors nothing. Curate testimonials that mention specific outcomes, features, or comparisons. If all your testimonials are generic, go back and ask better questions.

3. Loading a Heavy Widget

If your testimonial widget adds 2 seconds to your page load, you're hurting conversions more than you're helping. Always check the performance impact of third-party embeds. Use Lighthouse or PageSpeed Insights to measure before and after.

4. Not Updating Regularly

Testimonials from 2022 on a 2026 website look stale. Aim to add at least 2-3 new testimonials per quarter. Recent testimonials signal an active, growing product.

5. Too Many at Once

Showing 50 testimonials in a giant grid creates scroll fatigue. Curate your best 6-12 and rotate them. Quality and placement beat quantity every time.

A Simple Implementation Plan

1. Select your 5-8 best testimonials — look for specific outcomes, recognizable companies, and diverse use cases.
2. Choose 2-3 placements — homepage hero section, near your CTA, and on your pricing page.
3. Pick a display method — grid for the main section, inline quotes near features, hero quote above the fold.
4. Embed with a lightweight tool — use Trustfolio or hand-code it, but avoid heavy widgets that slow your page.
5. Measure the impact — run an A/B test or at minimum track conversion rates before and after adding testimonials.