Social proof: live trust notifications

The Social Proof widget shows a small notification in a corner of your site that says what just happened: someone bought a plan, someone signed up, someone left a review. It pins itself to a corner, slides in, shows for a few seconds, then makes way for the next one. Each toast carries an icon, a line of text, and a “just now” style time, so a hesitating visitor sees that real people are using what they are looking at.

One thing to be clear about up front: every notification is a real event you send in. Amabrik does not invent names, does not randomize purchases, and shows nothing at all when you have not sent any events. There is no “fake stream” mode, on purpose. A made-up notification, the moment a visitor spots one that cannot be real, costs you the trust you were trying to build. So the widget is fed by your own data: a webhook from your store or app, a one-line call on your success page, or approved reviews from your Reviews widget.

It also keeps nothing. Events flow through to the toast and are not stored. Amabrik holds no list of who bought what.

Turn it on

1. Open the dashboard at app.amabrik.com and go to Widgets.
2. Click the Social proof card. With no social proof widget yet, you go straight into creating one and the editor opens on a fresh instance.
3. The toast floats and pins itself to a corner, so there is no placeholder div to drop and no extra install step beyond the one Amabrik snippet you already paste on your site (see Getting started).
4. Connect at least one source of events (next section). Until an event comes in, the widget renders nothing, which is the expected state for a brand new instance.
5. Flip the enable toggle on.

The editor saves on its own as you work. A “Saved” mark appears next to the widget name once a change is stored.

With one or more social proof instances already created, the card opens the instances list instead, where “New social proof” starts the same create flow. Each row has an enable switch, edit, duplicate, and delete.

The notification types

There are four event types. Each has its own icon and its own message template:

• Purchase (a cart icon): a recent sale.
• Signup (a person icon): a new account, trial, or subscriber.
• Review (a star icon): a recent review.
• Custom (a bell icon): anything else you want to surface, like a booking or an enquiry.

Each event can also carry an optional location (for example “Paris”) and an optional detail (for example the plan or product name). You decide in the editor whether to show those.

How events get in

You feed the widget from the Content tab, under the Sources section. There are three ways in, and you can use any mix of them.

A webhook

The Sources section shows a webhook URL unique to this widget. It looks like this:

https://api.amabrik.com/v1/event/YOUR_WIDGET_ID?token=YOUR_SECRET

Paste that URL into Stripe, WooCommerce, PayPal, Zapier, or anything else that can send a webhook. The URL carries a private secret, so keep it server side only and never put it in a public page.

Stripe is parsed for you. Point a Stripe webhook at the URL and a completed checkout becomes a purchase notification automatically, with the amount and the billing location filled in. You do not have to format anything.

For everything else, POST this JSON to the URL:

{ "type": "purchase", "location": "Paris", "detail": "the Pro plan" }

The type is one of purchase, signup, review, or custom. The location and detail fields are optional. Send a signup with { "type": "signup", "location": "Berlin" }, and so on.

From your own page

On your success or thank-you page, you can call this directly in the browser:

Amabrik.event({ type: "signup" });

This one needs no secret. It only works from your own site: the call is checked against your domain, so a copied snippet running anywhere else cannot fire an event. Use it when the moment you want to capture happens in the browser (a form submit, a checkout confirmation page) rather than on your server. You can pass location and detail here too, the same way as the JSON above.

Approved reviews

Under Sources there is a switch, “Show approved reviews as toasts”. Turn it on to pull recent approved reviews from your Reviews widget and show them as review notifications, with no extra setup.

Set it up, tab by tab

The editor uses the same tabs as every Amabrik widget, with a live desktop and mobile preview beside the settings.

Content

• Sources: the webhook URL, the from-your-page snippet, and the approved-reviews switch, all covered above.
• Messages: the message template for each event type, in your default language. Each template can use {location} and {detail} where you want them. For example, the purchase template defaults to “Someone {location} just purchased {detail}”. If an event has no location or detail, the placeholder is removed cleanly so the line still reads naturally. Below the templates are three switches: Show location, Show detail, and Show time (the “just now” / “2 min ago” line).

Style

• Accent color: a preset palette plus a custom picker. The accent tints the icon.
• Toast background, Icon background, Text, and Border: each is a full-width color row. The background opens the color, gradient, or image editor; the border can be left on a subtle default.
• Text typography: font, weight, line height, letter spacing, and transform.
• Corner radius: how rounded the toast is, with a separate mobile value.

Display

• Position: a visual corner picker. Pick top left, top right, bottom left, or bottom right. The toast pins itself there and flips sides on its own for right-to-left languages.
• Entrance animation: Slide, Fade, or Pop.
• Show the icon: a switch to hide the icon and show text only.
• Timing: four number fields.
  • Initial delay: seconds to wait after the page loads before the first toast (default 4).
  • Time on screen: seconds each toast stays visible (default 5).
  • Gap between toasts: seconds of quiet between one toast and the next (default 6).
  • Max per session: a cap on how many toasts a single visitor sees, where 0 means unlimited.
• Loop: when all your events have shown, start again from the beginning.

Targeting

Choose where the widget runs: which pages (by URL rules), which devices (desktop, mobile), and so on, using the same Targeting panel as every other widget.

Advanced

• Languages: covered in the next section.
• Direction: reading direction, Auto, LTR, or RTL. Auto follows the visitor’s language (right to left for Arabic, Hebrew, and similar), otherwise left to right.
• Analytics: send a GA4 event when a notification is shown or clicked. Amabrik does not load Google Analytics; it sends to the GA4 or Tag Manager already on your site, respects cookie consent, and fires nothing until you add an event here.
• Custom CSS: target the widget’s Shadow DOM with selectors like .asp-toast, .asp-icon, .asp-msg, and .asp-meta.

Languages

Set a default language and edit its message templates in the Content tab. Turn on auto-detect to show each notification in the visitor’s browser language when you have it, otherwise the default.

Add a language from the list at the bottom of the Languages panel. Each added language gets a Translate button that opens its own fields: the purchase, signup, review, and custom messages, plus the “Someone” label and the “just now” label. The same widget can then reassure every market you sell to.

Tips

• Send real events only. This is the whole point. Wire the webhook to your actual store or app so each toast is a genuine event. Never script a stream of fake notifications. Faking it is also against the law in some places: the US FTC bans fake reviews and testimonials outright.
• Pace it so it reassures, not nags. A short time on screen with a comfortable gap reads as steady activity. Toasts back to back read as a hard sell. The defaults (5 seconds on, 6 second gap) are a good starting point.
• Use Max per session so a returning visitor is not shown the same handful of events on a loop all day.
• Show location and detail when you have them. “Someone from Paris just bought the Pro plan” is far more convincing than “Someone just bought”.
• Match the corner to your page. If you run a chat button in the bottom right, put social proof in the bottom left so they do not stack.

FAQ

How do I send events to the widget?

Three ways: paste the widget’s webhook URL into your store, app, or Zapier so each real sale or signup posts an event; call Amabrik.event({ type: "signup" }) on your own success page; or turn on the approved-reviews switch to pull from your Reviews widget. Stripe is parsed for you. For other webhooks, POST a small JSON body with a type of purchase, signup, review, or custom.

Are the notifications real or made up?

Real. The widget only ever shows events you send in, so with none it shows nothing. There is no fake-stream mode and Amabrik never invents a name or a purchase. A notification a visitor can tell is fake does the opposite of its job.

Where on the page does the notification appear?

In whichever corner you pick under Display: top left, top right, bottom left, or bottom right. It pins itself there, slides in, and flips to the correct side for right-to-left languages.

How often does it show, and how do I slow it down?

You control it under Display, Timing. Set the initial delay before the first one, how long each stays on screen, the gap between them, and a max per session. Turn Loop off if you want it to stop after showing each event once.

What kinds of events can I show?

Four types: purchases, signups, reviews, and a custom type for anything else (a booking, an enquiry, an upgrade). Each can carry an optional location and an optional detail like the product or plan.

Does it store my customers’ data?

No. Events pass through to the notification and are not kept. Amabrik holds no list of who bought what, so there is no second copy of your customer data sitting on our servers.

Does it work in other languages?

Yes. Set a default language, translate the message templates per language, and turn on auto-detect so each visitor sees the toast in their own browser language when you have it.

Why is the webhook URL secret and the page call not?

The webhook URL carries a private token because it is called from a server, so it has to prove it is allowed to send events. The in-page Amabrik.event call carries no token: it is allowed only when it runs on your own verified domain, so a copied snippet on another site cannot fire events. Keep the webhook URL server side and never put it in a public page.