Webflow installation
Add a testimonial widget to your Webflow site
Paste two lines into a Code Embed element, publish, and your approved testimonials appear on the live site. Generate the exact code for your setup below, then check it against the troubleshooting list.
“We put the review wall under our pricing table and prospects quote the reviews back to us on calls.”
“StoryProof made collecting and showing real customer video reviews effortless for us.”
“The widget looks native on our site. Nobody can tell it is embedded.”
“Collecting video reviews used to be the hardest part. Now it takes one link.”
“Set up in ten minutes, and support answered the one question I had straight away.”
“Real faces and real voices sell far better than anything we could write ourselves.”
Code generator
Get the exact code for your Webflow page
Paste your widget id from StoryProof (or leave the placeholder to see the shape), choose how many pages the widget appears on, and copy what to paste and where.
Code Embed element, in the section where the widget should appear
Designer › Add panel › Code Embed
<div data-storyproof-widget="YOUR_WIDGET_ID"></div>
<script src="https://app.storyproof.io/embed.js" async></script>Then publish the site and open the published or webflow.io staging URL. Webflow does not run scripts inside the Designer.
The code is assembled in your browser. Nothing is sent anywhere.
The problem, solved
What Webflow leaves you to solve, and how StoryProof covers it
- Problem 1
Webflow cannot collect testimonials from customers
A CMS collection can display quotes, but someone still has to chase customers, copy their words in and find video hosting.
How StoryProof solves it
StoryProof gives you one collection link where customers record a video, leave an audio note or write a review in the browser, with nothing to install.
- Problem 2
Each new quote means editing and republishing
On a client site that can mean a Designer session and a publish for every single review, so the page goes stale.
How StoryProof solves it
The embedded widget pulls its testimonials from StoryProof on every load, so new approvals reach the Webflow page with no publish step.
- Problem 3
I want widgets on several pages without duplicate scripts
Pasting the script into every Code Embed clutters the project and gets hard to audit later.
How StoryProof solves it
Load embed.js once, for example in the site footer custom code, and it fills every StoryProof widget div on the page.
- Problem 4
The client wants a say in what goes live
A testimonial with a typo or an off-brand remark on a page you built reflects on your work, not only on theirs.
How StoryProof solves it
Submissions stay private until approved, and you then pick exactly which approved testimonials each widget shows.
In StoryProof
Install it on Webflow
Five steps from an empty workspace to a widget on your published site.
Step 1 of 5
Build the widget in StoryProof
Pick a layout, choose which approved testimonials it shows, and copy its embed code. Widgets per workspace: Free 1, Starter 5, Pro unlimited. A small "Powered by StoryProof" badge shows until Pro.
Step 2 of 5
Add a Code Embed element where the widget belongs
In the Webflow Designer, open the Add panel, drag a Code Embed element into the section you want, and paste the code from the generator. Save and close the editor.
Step 3 of 5
Give the section room
Put the Code Embed inside a container or a div block with the width you want. The widget fills the width it is given and sets its own height.
Step 4 of 5
Publish, then check the live or staging URL
Webflow does not run custom scripts inside the Designer, so the element shows as a placeholder there. Publish and open your webflow.io staging address or the live domain to see the widget.
Step 5 of 5
Check it on a phone
Open the published page on a phone or with your browser’s device toolbar at 390 pixels wide. Wide layouts such as walls collapse to fewer columns on their own.
Live preview
Pick a layout before you paste
This is a working widget, the same component the embed script draws. Try the arrows and the cards. The reviews in it are samples from stock personas, not StoryProof customers.
1:22“StoryProof made collecting and showing real customer video reviews effortless for us.”
1:14“Collecting video reviews used to be the hardest part. Now it takes one link.”
1:09“Real faces and real voices sell far better than anything we could write ourselves.”
1:33“Setup took minutes and the reviews started coming in the same week.”
1:17“Our customers actually record. That never happened with our old review form.”
1:22“StoryProof made collecting and showing real customer video reviews effortless for us.”
1:14“Collecting video reviews used to be the hardest part. Now it takes one link.”
1:09“Real faces and real voices sell far better than anything we could write ourselves.”
1:33“Setup took minutes and the reviews started coming in the same week.”
1:17“Our customers actually record. That never happened with our old review form.”
Where to put it on a Webflow page
Before you start
Troubleshooting and limits
Nothing shows in the Designer
Expected. Webflow disables custom scripts in the Designer. Check the published site instead.
The Code Embed option is greyed out
The site is on a free Starter plan. Webflow requires a paid Site plan or Workspace for custom code. No embed, from StoryProof or anyone else, will run until then.
The widget is blank on the live site
Check the id in the div matches the widget in StoryProof, and that the widget has approved testimonials in it. An empty widget draws nothing.
There is no native Webflow app
StoryProof installs on Webflow with embed code, the same way it installs on any site that accepts HTML. There is no Webflow Marketplace app or CMS sync.
The "Powered by StoryProof" badge
It shows on Free and Starter, and can be removed from Pro.
FAQ
Questions people ask
Short answers to what usually comes up next.
Do I need a paid Webflow plan to add a testimonial widget?
Yes. Webflow runs custom code only on sites with a paid Site plan or in a paid Workspace. That applies to every third-party embed, not only StoryProof.
Will the widget slow my Webflow site down?
The script loads with the async attribute, so it does not block the rest of the page from rendering.
Can I use the widget inside a Webflow CMS collection page?
A Code Embed placed in a collection template shows the same widget on every item page. A different widget per item would need a different widget id per item, which StoryProof does not fill in from CMS fields.
What if my Webflow site uses a cookie consent banner?
Some consent tools hold back third-party scripts until a visitor accepts. Check how your banner treats the embed script, then load the published page with consent declined to see what those visitors get.
Still have a question? Ask the StoryProof team or book a demo.
Get your widget id
Create a free workspace, approve your first testimonials and copy the embed code into Webflow.
Sources
- Custom code in head and body tags, Webflow Help Center. Checked 2026-11-04.
- Custom code embed, Webflow Help Center. Checked 2026-11-04.
Last updated 2026-11-04.