Discourse installation
Discourse Testimonials with a Theme Component
Discourse keeps custom HTML out of posts and inside themes. An admin creates a small theme component, puts the StoryProof div and script in its HTML panes, and attaches it to the live theme. Because Discourse loads once and then swaps content in place, the result needs checking after a few clicks, not only on the first page view.
- Which theme pane holds the div and which holds the script
- The CSP setting to check if embed.js is refused
- A plain link fallback that survives page swaps
Theme component code
Three pastes into one Discourse theme component
Type your widget id. The div goes in the pane that renders where you want the testimonials, usually the footer. The script goes in the closing body pane so it loads once. The third card is a plain link to keep in the same footer, for visitors who arrive after Discourse has swapped the page.
Part 1 · Footer pane of your new component
Admin › Customize › Themes › Install › Create new › component › Edit CSS/HTML › Footer
<div data-storyproof-widget="YOUR_WIDGET_ID"></div>Part 2 · Closing body pane of the same component
Same component › Edit CSS/HTML › </body>
<script src="https://app.storyproof.io/embed.js" async></script>Part 3 · Footer pane, under the div
Same component › Edit CSS/HTML › Footer
<p class="sp-member-stories">
<a href="[your StoryProof Wall of Love link]">Read what members say about us</a>
</p>Save, add the component to your active theme, then load the forum in a private window. Click into a topic and back again: if the testimonials vanish after a click, the link underneath still points visitors to every story.
Your widget id is combined with the code here, in this tab only. Nothing is sent to Discourse or saved.
The problem, solved
Forum praise that nobody outside the thread sees
Discourse is good at holding conversations and not built to showcase them. These are the gaps admins describe and what the StoryProof side covers.
- Problem 1
The best feedback is buried in old topics
A member writes a glowing reply in a support thread, it scrolls away, and a visitor deciding whether to join never finds it.
How StoryProof solves it
Send that member a StoryProof collection link so they can record a video, leave an audio note or write the praise properly, then show it in the footer widget once you approve it.
- Problem 2
There is no HTML block for posts
Admins look for a place in the composer to paste embed code. Discourse’s documented home for custom HTML and scripts is a theme or theme component.
How StoryProof solves it
The StoryProof embed is only a div and one async script, which fit the component’s HTML panes without any plugin or Discourse rebuild.
- Problem 3
Worried an outside script breaks the forum
A theme change hits every member at once, and a bad snippet in the active theme is hard to back out while the site is misbehaving.
How StoryProof solves it
Keep StoryProof in its own small component with just the two embed lines, so detaching it removes everything. Discourse’s safe mode URL disables themes if you need to get back in.
- Problem 4
I only want proof about the product
A forum footer should not repeat off topic thanks or praise for a moderator; visitors want to hear what the product did for people.
How StoryProof solves it
You pick which approved testimonials go into the widget, so the footer shows the product stories and nothing else.
- Problem 5
Widget missing after clicking between topics
Discourse loads once and swaps content as people move around, and theme scripts are known to run on that first load only.
How StoryProof solves it
Keep a plain link to your hosted Wall of Love next to the div. It is ordinary HTML, so it shows on every view whether or not the widget has filled.
In StoryProof
Set it up in Discourse
All of this happens in the admin area, so it needs an account with admin rights on the forum.
Step 1 of 5
Prepare the widget in StoryProof
Create a widget for the forum, add the approved testimonials it should carry and pick a compact layout. A footer is short on height, so a strip or a single quote reads better than a full wall.
Step 2 of 5
Create a theme component
Go to Admin › Customize › Themes, choose Install, then Create new. Name it something like StoryProof testimonials, pick the component option and create it.
Step 3 of 5
Paste the code into its panes
Open Edit CSS/HTML on the component. Put the div and the fallback link in the Footer pane and the embed.js line in the </body> pane, then save.
Step 4 of 5
Attach it to the live theme
Open the theme visitors use and add the component under Included components, or use Include component on these themes from the component page if you run several themes.
Step 5 of 5
Test as a visitor, then click around
Load the forum logged out, confirm the footer fills, then open a topic and return. If the browser console reports a blocked script, see the content security policy note below.
Where the code can sit in a Discourse theme
Theme panes are site wide. Pick by what you want every visitor to see on every page.
Before you start
Discourse specifics to know
Single page navigation
Discourse loads once and swaps content in place, and theme scripts run on that initial load. StoryProof makes no claim that the widget refills after those swaps, which is why the page keeps a plain link beside it.
Content security policy
Discourse adds a nonce to theme script tags and, since 3.3.0.beta1, uses strict-dynamic, so outside scripts usually load. If embed.js is still refused, an admin can add the StoryProof domain to the content_security_policy_script_src setting.
Site wide only, without code
The theme panes render on every page. Limiting the widget to the forum home or one category needs custom theme JavaScript, which this guide does not cover.
No StoryProof plugin
StoryProof has no Discourse plugin and does not sync with Discourse. Member praise reaches the widget through the collection link and your approval, not by importing topics.
Docs as of 2026-11-14
The Discourse steps follow Meta guides and staff answers as read on 2026-11-14 and have not been tried on a live forum; admin labels move between releases. Widgets per workspace: Free 1, Starter 5, Pro unlimited. A small "Powered by StoryProof" badge shows until Pro.
FAQ
Questions people ask
Short answers to what usually comes up next.
Can I paste the embed straight into a topic instead?
The route Discourse documents for scripts is a theme or theme component, not the post composer. Use the component, and post the Wall of Love link in a topic if you also want it there.
Why does the widget show on the first page but not after I click a topic?
Discourse is a single page application: it loads once and replaces content as you move around, and scripts placed in a theme run on that first load. The plain link in the footer is there for exactly this case.
My theme is installed from a git repository. Should I edit it?
Discourse staff advise against editing an installed external theme directly because updates overwrite the change. A separate component attached to it keeps your code safe across theme updates.
Something broke after I saved. How do I get back in?
Visit /safe-mode on your forum to load it without the active theme and components, then detach or fix the StoryProof component.
Do I need the script once per widget?
No. One embed.js on the page fills every StoryProof div on it, so a second widget in another pane only needs its own div.
Still have a question? Ask the StoryProof team or book a demo.
Bring member praise out of the threads
Collect stories with one link, approve them, and add a small theme component to your forum.
Sources
- Beginner’s guide to using Discourse Themes, Discourse Meta. Checked 2026-11-14.
- Mitigate XSS attacks with Content Security Policy, Discourse Meta. Checked 2026-11-14.
- How do you force a script to refire on every page load in Discourse?, Discourse Meta. Checked 2026-11-14.
- What’s the fastest and easiest way to add a persistent javascript file or snippet, Discourse Meta. Checked 2026-11-14.
Last updated 2026-11-14.