Softr installation
Softr Testimonials with Custom Code Blocks
Softr’s Custom code block accepts HTML, CSS and JavaScript anywhere in a page, on paid plans. Paste the StoryProof div and script into that block on the page that should show testimonials. Avoid the app-wide footer for the script: in Softr’s single page app mode, those scripts run on the first page load only.
- Code for one Custom code block
- Why app-level footer scripts can miss later pages
- Public page or member portal: what to show where
Code generator
Code for a Softr Custom code block
Type your widget id. Both lines belong in one Custom code block on the page itself, not in the app’s global footer, so the script runs whenever that page is opened.
A Custom code block on the page
Softr Studio › add block › Static › Custom code › block settings
<div data-storyproof-widget="YOUR_WIDGET_ID"></div>
<script src="https://app.storyproof.io/embed.js" async></script>Use Preview, then publish. Test two ways: open the page directly, and reach it by clicking through from another page of the app.
Your id is placed into the code inside this browser only.
The problem, solved
Testimonials in a Softr app: the snags and the StoryProof answer
- Problem 1
Our testimonials table needs manual upkeep
A list block over an Airtable or Softr table looks tidy, but someone still pastes each quote in, checks permission and fixes typos.
How StoryProof solves it
Customers submit through StoryProof and nothing appears until you approve it. The Softr page shows a widget of the approved ones you choose.
- Problem 2
The widget vanishes after clicking around
A script pasted into the app footer runs on the first load only in SPA mode, so a page reached by in-app navigation can show an empty space.
How StoryProof solves it
Keep the div and the script together in a Custom code block on that page, so the code arrives with the page each time it renders.
- Problem 3
Members and visitors need different stories
A public landing page persuades prospects, while a member portal is better served by stories about getting value from the membership.
How StoryProof solves it
Tag testimonials by audience and build one widget per audience. Each Softr page gets the block with its own widget id.
- Problem 4
Members have no easy way to contribute
Building a submission form inside Softr does not give members a way to record a video.
How StoryProof solves it
Link a Softr button to your StoryProof collection link, or print it as a QR code for an event, and members leave their testimonial there.
In StoryProof
Add the widget in Softr
Step 1 of 4
Fill a widget for this page
In StoryProof, pick the approved testimonials for the audience of this Softr page and copy the widget id.
Step 2 of 4
Add a Custom code block
In Softr Studio, add a block to the page and choose Custom code from the Static category. Move it to where the testimonials belong.
Step 3 of 4
Paste both lines
Open the block settings and paste the div and script. Softr inserts the code inside the page body at the block’s position.
Step 4 of 4
Preview, publish, then click through
Preview, publish, and test on the live app twice: load the page directly, then arrive at it from another page through the menu. Both visits should show the widget.
Where Softr lets you put code
Before you start
Softr limits
Custom code is a paid feature
Softr lists custom code for its Pro plan and above. On a lower Softr plan, link to your hosted Wall of Love from a button instead.
SPA navigation is the risky part
Softr warns that app-level scripts run once in SPA mode. StoryProof has not published how its script behaves across client-side navigation, so test the click-through path before you rely on it.
Code you add is yours to maintain
Softr presents its own code snippets as examples to adapt rather than drop-in fixes. For anything about the widget itself, ask StoryProof rather than Softr.
Badge on lower StoryProof plans
Widgets show a small StoryProof badge until Pro.
Docs read on 2026-11-12
Block and setting names follow Softr’s documentation as read on 2026-11-12. These steps have not been followed in a real Softr app yet, and Softr renames blocks from time to time.
FAQ
Questions people ask
Short answers to what usually comes up next.
Can I show testimonials from my Airtable base instead?
Yes, with a Softr list block, but then you collect and check them yourself. StoryProof handles collection and approval, and the widget shows the result.
Will the widget work on a page only logged-in members can see?
The block renders for whoever can see the page, so the widget shows to members only. Test it while logged in as a member, not as the app owner.
Do I need script type module, as Softr suggests for SPA code?
Softr recommends it to avoid global name clashes in your own scripts. The StoryProof line is a plain async script from our server; paste it as generated.
Can the Softr app owner’s team manage the testimonials?
Yes, inside StoryProof. Roles are included on every plan, so a teammate can approve testimonials without touching Softr.
Still have a question? Ask the StoryProof team or book a demo.
Let your members tell the story
Collect and approve testimonials in StoryProof, then add one Custom code block in Softr.
Sources
- Custom Code Block Overview, Softr Documentation. Checked 2026-11-12.
- Custom Code Snippets, Softr Documentation. Checked 2026-11-12.
Last updated 2026-11-12.