Proof
Connect Proof by useproof.com with Webflow to display real-time social proof notifications on your site.
"Dave from Austin, TX just signed up."
"57 people downloaded the guide in the last 24 hours."
Proof by useproof.com displays real-time notification popups like these on your site, turning anonymous traffic into visible activity that drives conversions.
Connect Proof to your Webflow site to add trust signals to signup pages, pricing pages, and download funnels without rebuilding your design or writing custom JavaScript. It's a fit whether you run landing pages, market a SaaS trial, promote an opt-in course funnel, or manage conversion optimization across multiple client sites.
How to integrate Proof with Webflow
What is Proof? Proof is a social proof notification and website personalization platform built by Proof Technologies, Inc. at useproof.com. It is distinct from proof.com. Through its Pulse product, it offers Recent Activity notifications that show individual signups or purchases with location data, Live Visitor Count widgets that display how many people are currently viewing a page, and Hot Streaks that aggregate total actions over a time window. Proof also includes built-in A/B testing so you can measure how notifications affect conversion rates.
Connect Proof to your Webflow site to display real-time visitor activity on landing pages, signup forms, and sales pages. The typical setup takes about five minutes and requires no coding beyond pasting a snippet. Because Proof works through a single JavaScript pixel that fires across unlimited domains, agencies and freelancers can deploy it on multiple client sites from one account.
You can connect Proof and your Webflow site in a few ways:
- The Proof pixel via custom code handles site-wide or page-specific notification display without writing code beyond a paste operation.
- Zapier lets you send Webflow form submissions to Proof as conversion events, feeding real data into your notifications.
- The Webflow and Proof APIs give you programmatic control over pixel injection, webhook-based data syncing, and CMS-driven social proof displays, but require server-side development.
Most implementations start with the custom code approach, then add Zapier or API methods as conversion tracking needs grow.
Add the Proof pixel with custom code
Paste a JavaScript pixel into your site's custom code in head and body tags settings to connect Proof. This pixel captures visitor activity and displays notification popups wherever it runs. You can install it across your entire site, on individual pages, or at specific positions within a page layout. You need a paid Site plan or Workspace plan, since custom code fields aren't available on the free plan.
Before starting, log into your Proof dashboard at useproof.com and go to Pixel Install (or visit https://go.useproof.com/pixel) to copy your JavaScript tracking snippet.
You can place the snippet site-wide, on specific pages, or inside a Code Embed element.
Install site-wide via site settings
Use a site-wide install when you want Proof notifications available on every page. Proof's official Webflow guide instructs you to place the pixel in the head code section, which ensures the script is available as the page loads and notifications fire correctly across your site.
To install the Proof pixel site-wide:
- Open your dashboard and select your site.
- Click the gear icon to open Site Settings.
- Click the Custom Code tab.
- Scroll to the Footer Code section and paste your Proof JavaScript snippet.
- Click Save Changes.
- Publish your site. The pixel won't appear on your live site until after you publish.
If Proof's own documentation specifies placing the snippet in the <head>, use the Head Code section instead. The navigation path is the same. You can then control which pages display notifications through Proof's display URL rules in the campaign builder, rather than limiting where the pixel loads.
Install on specific pages
Install the pixel at the page level when you only need Proof on certain pages, like a single landing page or pricing page.
To add the pixel to a specific page:
- Open your site in the Designer.
- Open the Pages panel from the left toolbar.
- Hover over the target page and click the gear icon next to the page name.
- Scroll to Custom Code.
- Paste the Proof snippet into either the Inside
<head>tag field or the Before</body>tag field, following Proof's placement recommendation. - Close page settings and publish your site.
This method keeps the pixel off pages where you don't need it, which avoids unnecessary script loading on high-traffic pages that aren't part of your conversion funnel.
Place at a specific position with a Code Embed element
A Code Embed element lets you position the Proof snippet at an exact location within your page layout, such as next to a CTA button or below a signup form.
To add Proof via Code Embed:
- Open your site in the Designer.
- Open the Add panel (the + icon in the left toolbar).
- Drag a Code Embed element onto the canvas at the target location.
- Double-click the Code Embed element to open the code editor.
- Paste your Proof JavaScript snippet.
- Click Save & Close.
- Publish your site.
After installing through any of these methods, return to https://app.useproof.com/pixel and confirm a green status indicator appears. Proof only detects the pixel after you publish, not in preview mode.
Connect Proof and Webflow with Zapier
Zapier provides a direct connection between Webflow form submissions and Proof conversion events. When a visitor submits a form on your site, Zapier forwards the data to Proof, where it feeds into notification displays. This is the recommended path if you want your Proof notifications to reflect real form activity without building a custom data pipeline.
A pre-built Zapier template creates new Proof conversions from new Webflow form submissions. The template maps form fields to Proof's conversion data structure automatically.
To set up the Zapier integration:
- Log into your Proof account and open a campaign. At the Capture data step, select Zapier and click Publish Changes. Copy the Proof API Key from the popup (also accessible in Account Settings).
- In Zapier, go to My Apps, click Connect New Account, search for Proof, and paste your API Key.
- Create a new Zap with Trigger: Webflow: New Form Submission.
- Set Action: Proof: Create Conversion.
- Map the form fields to Proof's conversion fields: Campaign (required), Email (required), First Name, City, Region, Country, and IP Address.
- Test the Zap and turn it on.
The Zapier connection supports these capabilities:
- Automatically feed form submissions into Proof as conversion events
- Display real opt-in or signup activity in Recent Activity notifications
- Attribute conversions to specific Proof campaigns
If you're working on a non-technical team, Zapier is the simplest way to connect form activity to Proof without maintaining a separate middleware service.
Build with the Webflow and Proof APIs
If you need automated pixel deployment, real-time data syncing, or CMS-driven social proof displays, the API path gives you programmatic control. This approach requires server-side development and a middleware layer (your own server, a serverless function, or a tool like Zapier) to process data between systems.
Two common API use cases are below.
- Proof's custom webhook endpoint receives conversion data via JSON POST requests, with
typeandemailas required fields - The Data API is the API for the CMS, form submissions, and site publishing
- Webhooks trigger real-time events when forms are submitted, CMS items change, or sites are published
Forward Webflow form submissions to Proof via webhook
This pattern sends real-time form data to Proof's conversion endpoint. When someone fills out a form on your site, the data flows through your middleware and arrives in Proof as a conversion event.
To implement this:
- Create a webhook subscription for the
form_submissiontrigger by sending a POST request tohttps://api.webflow.com/v2/sites/{site_id}/webhookswith your bearer token and a JSON body specifying thetriggerTypeand your middleware URL. - In your middleware, extract the
emailandFirst Namefields from the form submission payload. - POST the extracted data to Proof's custom webhook URL (generated in the Capture step of your Proof campaign) using this JSON structure:
{
"type": "custom",
"email": "visitor@example.com",
"first_name": "Zaphod",
"city": "",
"state": "",
"country": "",
"ip": ""
}
You must include type and email. All other fields are optional. Set the content type to application/json.
Inject the Proof pixel programmatically via the Custom Code API
If you're an agency managing multiple sites, use the Custom Code API to register and apply the Proof pixel without opening each site manually. You'll need an OAuth token from an OAuth Code Grant flow. Site tokens won't work for Custom Code endpoints.
To deploy the pixel via API:
- Register the Proof pixel as a hosted script by sending a POST request to
https://api.webflow.com/v2/sites/{site_id}/registered_scripts/hostedwith the script's URL. - Apply the script site-wide by sending a PUT request to
https://api.webflow.com/v2/sites/{site_id}/custom_code, or target a specific page withhttps://api.webflow.com/v2/pages/{page_id}/custom_code. - Publish the site by sending a POST request to
https://api.webflow.com/v2/sites/{site_id}/publish.
You'll need these OAuth scopes: sites:read, sites:write, pages:read, pages:write, custom_code:read, and custom_code:write. Each site supports up to 800 registered scripts.
What can you build with the Proof Webflow integration?
Integrating Proof lets you add conversion-focused social proof signals to any page without modifying your site's design or managing a separate frontend.
- Display Recent Activity popups on a webinar registration page or free trial landing page, showing real names and locations of people who just signed up. Visitors see "Sarah from Denver, CO just registered" as they consider filling out the form themselves.
- Add Live Visitor Count widgets to product pages or flash sale pages that show "88 people are viewing this page right now." This works well for e-commerce product launches or limited-availability offers where visible demand creates urgency.
- Show aggregate download counts on gated content pages, such as "57 people downloaded this guide in the last 24 hours." If you create courses or market content, use this to increase opt-in rates on lead magnet pages.
- Install the Proof pixel across multiple client sites from a single Proof account, using Proof's built-in A/B testing to measure notification impact per client. As an agency, you can use the conversion analytics dashboard to generate client-facing reports showing the before-and-after effect of social proof on each site.
If you need more control over how conversion data flows between your forms and Proof campaigns, the API integration path covers those cases.
Frequently asked questions
Yes. Custom code fields are not available on the free Webflow plan. You need an active paid site plan or a paid workspace plan (Core, Growth, Agency, or Freelancer) to access the custom code settings where the Proof pixel is pasted. See the custom code documentation for details on where custom code can be added at each plan level.
For most general tracking scripts, the footer code section in Site Settings > Custom Code is a common default, since placing scripts in the footer means page content loads before JavaScript executes. However, Proof's own installation guide specifies the
<head>tag, so use the head code section instead.Yes, through two approaches. On the Webflow side, you can add the pixel to individual page settings rather than site-wide custom code, so the script only loads on those pages. On the Proof side, you can install the pixel site-wide and then configure display URL rules within the Proof campaign builder to control which pages actually show notifications.
Third-party scripts add load time. Any tracking scripts or notification widgets will increase metrics like LCP and FID, particularly if they are render-blocking. Ways to reduce the impact include loading scripts asynchronously, using Google Tag Manager with a script delay, and selectively disabling scripts on mobile. Verify with Proof whether the Pulse snippet supports
asyncordeferattributes.After publishing your Webflow site with the Proof pixel installed, visit
https://app.useproof.com/pixelin your Proof account. A green status indicator confirms the pixel is active and detected on your live domain. Notifications will not appear in Webflow's preview mode, so always test on your published URL. Proof also provides a dedicated testing guide that walks through verifying notification display and troubleshooting common issues.
Description
Add Proof social proof notifications to any Webflow site by pasting a JavaScript pixel into site settings or page-level custom code.
This integration page is provided for informational and convenience purposes only.
Twise
Connect Twise, an AI chat assistant, with Webflow to answer visitor questions, capture leads, and respond in 92 languages using a chat widget that learns from your site content.
Flowstar: Banners
Connect Flowstar: Banners with Webflow to display promotional pop-ups and announcement banners without writing code
Flowstar Urgency Countdown Timer
Add deadline-driven countdown timer bars to any Webflow page using Flowstar's no-code app.
Click to Call
Connect Click to Call with Webflow to add a floating phone button that lets visitors call your business directly from any page.
Quiz Popup
Connect Quiz Popup with Webflow to embed branching quiz popups that collect visitor data, capture emails, and route product recommendations on your site.
Social Chat Buttons
Connect Social Chat Buttons with Webflow to add floating multi-channel messaging buttons to your site, connecting visitors to over 15 platforms.
Flowstar Customer Testimonials Slider
Connect Flowstar with Webflow to display customer testimonials in slider or grid layouts using the Flowstar app embed or the Webflow CMS API for programmatic control.
Supersparks
Connect Supersparks with Webflow to add commenting, reviews, community posting, and upvoting through pre-built components and custom attributes.
Smartarget FAQ
Connect Smartarget FAQ, a customizable FAQ widget, with Webflow to display frequently asked questions on your site and reduce support requests.
Related integrations
Get started for free
Try Webflow for as long as you like with our free Starter plan. Purchase a paid Site plan to publish, host, and unlock additional features.
