Skip to main content

Customize the Timeline

Customization

Stars, buttons and links
#7c3aed
Colors & size
Rating star icon color
#f59e0b
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
Author & Identity
Show avatarProfile photo icon
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
Show dateTimestamp, e.g. 2 hours ago
How each date is written
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: Timeline

2 hours agoGoogle logoReview from Google

“We put the review wall under our pricing table and prospects quote the reviews back to us on calls.”

Jamie Whitfield
Jamie Whitfield
Founder & CEO @ Northbeam Studio
YesterdayTrustpilot logoReview from Trustpilot

“StoryProof made collecting and showing real customer video reviews effortless for us.”

David Anderson
David Anderson
Founder
3 days agoG2 logoReview from G2

“The widget looks native on our site. Nobody can tell it is embedded.”

Kieran Walsh
Kieran Walsh
Co-founder & CEO @ Relay HQ
4 days agoGoogle logoReview from Google

“Collecting video reviews used to be the hardest part. Now it takes one link.”

Allison Bennett
Allison Bennett
StoryProof customer
Powered byStoryProof
Timeline

Try this widget on your website

Copy the code below and paste it into your website.

<div data-storyproof-demo data-layout="timeline"></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 Timeline widget?

The Timeline arranges reviews along a vertical line, each one marked on the line with its date beside it. Dates are switched on by default for this layout, because here the order is the message.

Where a wall argues with quantity, a timeline argues with continuity: customers have been saying this for a long time, and someone said it again last week.

Where the Timeline works best

  • A changelog or “what's new” page, next to the releases the reviews are reacting to.
  • A case study or about page, to show a relationship or a reputation building over time.
  • Any page where stale proof is a worry, because recent dates on screen answer it directly.

When to choose a different layout

  • Choose the Testimonial List when the dates do not matter and you only need a compact column.
  • Choose the Testimonial Wall when you want the most reviews in the least scrolling.

What the Timeline can show

The date, as relative time or a fixed day, month and year, plus the platform badge, stars, the review text, and the reviewer's name, photo, job title and company.

Setting it up

  1. 1Sort newest first so the most recent review leads the spine.
  2. 2Choose the relative date format if reviews arrive often, and a fixed date format if the page is about specific milestones.
  3. 3The timeline can also open as a centred pop-up.

Timeline questions

Why use a timeline for testimonials?

Because it shows when people said it. A visitor who worries that your best reviews are years old can see at a glance that they are not.

Can I hide the dates?

Yes, the date is a toggle. Without dates the timeline keeps its spine, but most of its point is the dates, so the Testimonial List is often the better pick then.

Which date formats can I use?

A relative format such as “6 days ago”, or a full date written day-month-year with dots or slashes, or month-day-year with slashes.

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

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