Skip to main content
Compact proof

Avatar strip widget: customer faces that open their reviews

Every reviewer in one row of faces. Hover to see a name, click to read that person's review in a card beside the row.

Last updated

Customize the Avatar StripStart 7-Day Free Trial
  1. 1Step 1Avatar Strip chosenNot the right fit? Compare every layout side by side.Compare layouts
  2. 2Step 2Customize itColors, fonts and card style, previewed live as you change them.Open the builder
  3. 3Step 3Embed itPaste one snippet into Webflow, Framer, WordPress, Shopify or any site.See how to embed

Customize the Avatar Strip

Customization

Stars, buttons and links
#7c3aed
Colors & size
Rating star icon color
#f59e0b
Review card fill color
#0c1020
Reviewer name text color
#ffffff
Quote content text color
#e2e8f0
Type & card shape
How large the whole widget renders
Match my page is usually best. The widget takes on your section color
A different arrangement on phones. Switch the preview to Mobile to see it
Font family used for reviews
Card corner border radius
Card border
#1e293b
Author & Identity
Show authorFull name of reviewer
Show job title and companyJob position and company name
Show first names onlyTruncates last names, e.g. Jamie W.
Badges & Metadata
Show ratingStar rating icons
Show sourceSource platform, e.g. Google, Trustpilot, G2
Delivery
Inline, or floating over your page
Text & Media
Cuts the quote and offers the rest behind a link
Heading & buttons
Show a headingHeader title above widget
Show the overall scoreAn aggregate rating above the reviews
Show a tab per platformOne tab for each review source
Show a call-to-action buttonCall-to-action button
Show a Write a review buttonSends visitors to your review form
Show "Powered by"Footer brand watermark
SAMPLE REVIEWS

LIVE PREVIEW: Avatar Strip

Jamie WhitfieldDavid AndersonKieran WalshAllison BennettKatelyn RuizNathan CarterKylie SandersScott MitchellSarah ThompsonRon DelgadoSandy OkoroMelissa HartVirgil Marchetti
5.0/5loved by 9 customers, tap a face to read their review
Powered byStoryProof
Avatar Strip

Try this widget on your website

Copy the code below and paste it into your website.

<div data-storyproof-demo data-layout="avatar_strip"></div>
<script async type="text/javascript" src="https://storyproof.io/widget.js"></script>
See guides for
Shopify logoShopify install guideWordPress logoWordPress install guideWix logoWix install guideWebflow logoWebflow install guideSquarespace logoSquarespace install guideFramer logoFramer install guideNotion logoNotion install guideGhost logoGhost install guideWooCommerce logoWooCommerce install guide
Powered byStoryProof

What is the Avatar Strip widget?

The Avatar Strip lines up your reviewers' photos in a single overlapping row. Unlike a static avatar stack, every face is a way in: hovering shows the name, and a click opens that review in a card beside the row.

It gives a hero the look of a crowd while keeping every review one click away, so a sceptical visitor can check that the faces are real people with real things to say.

Where the Avatar Strip works best

  • A hero section, as the first thing a visitor sees under the headline.
  • Community and creator pages, where the people are the product.
  • A corner card or a pop-up, since this is one of the layouts that can be delivered either way.

When to choose a different layout

  • Choose the Trusted-by Row when you want a static summary with nothing to click.
  • Choose the Flip Card when you want larger portraits, with each review on the back of its card.

What the Avatar Strip can show

Reviewer photos, names on hover, and on click a card with stars, the review, the reviewer's name, job title and company, and the platform badge. Card colour, border and corner radius style that review card.

Setting it up

  1. 1Use reviews with clear headshots, because the strip is made of them.
  2. 2Keep it close to your headline so the row reads as part of the hero.

Avatar Strip questions

What happens when a visitor clicks a face?

That person's review opens in a card beside the row, with their stars, name, role and the platform the review came from.

Avatar Strip or Trusted-by Row?

Choose the strip when you want visitors to be able to read individual reviews. Choose the Trusted-by Row when a summary with nothing to click is enough.

Can it be delivered as a pop-up?

Yes. It can sit inline, open as a centred pop-up, or appear as a small card in a corner of the page.

Related layouts

Further reading: Review widgets: what they are and how to choose one · Compare every layout

1-Line Embed Integration

Embed on Any Platform With One Snippet

No developer skills needed. Copy your widget's two-line snippet, paste it into your site builder, and your testimonials appear wherever you put it.

Works With Every Website Builder:

FramerWebflowWordPressShopifyNext.js / ReactHTML / Tailwind
embed-widget.html
<div data-storyproof-widget="YOUR_WIDGET_ID"></div>
<script src="https://app.storyproof.io/embed.js" async></script>
Loads asynchronouslyEdits apply without re-pasting
Previous layoutTrusted-by RowAvatar stack and aggregate scoreNext layoutRating BadgeCompact score chip for a header

Every StoryProof widget layout

19 layouts, each with its own page, live preview and setup guide. Pick by where the widget will sit on your site.

Walls and grids

One story at a time

Video

Strips and banners

Compact proof

Let your customers make the case for you

Put your customers’ own words on the pages that sell. Start your 7-day free trial today.

Nothing to install • 7 days free • No credit card required