Add a feedback board to Webflow

With the UserNote app (recommended)

The app adds the Feedback button to every page through Webflow’s own custom code settings. It works on free Webflow sites too, which can’t paste custom code themselves.

• Sign up free at getusernote.com and create a board.
• Open the board’s Install tab and click Connect Webflow.
• Webflow asks you to approve UserNote. It needs two permissions: Sites (to list your sites and their domains, and to publish when you click Publish) and Custom code (to add or remove the UserNote script). Choose the workspace with your site and approve.
• Back in UserNote, your sites are listed. Choose bottom right or bottom left for the button and click Add next to your site.
• Click Publish now (or publish from Webflow). The button appears on the published site.

If your board has Allowed websites set, UserNote adds your site’s domains to it. In Webflow, the script is listed under Site settings → Custom code → Code added by Apps.

To change the button’s position or show a different board, choose the new setting and click Update or Use this board, then publish. To take the button off, click Remove and publish. Uninstalling the app in Webflow also removes the script. Disconnect Webflow, at the bottom of the panel, revokes UserNote’s access.

Before you start

Sign up free at getusernote.com, create a board, and copy your board ID from the board’s Install tab (it starts with ws_). Replace ws_YOUR_BOARD_ID in the snippets below with it.

Without the app: a Feedback button on every page

• In Webflow, open Site settings → Custom code.
• Paste this into Footer code (before </body> tag) and save:

<script src="https://getusernote.com/widget.js" data-workspace="ws_YOUR_BOARD_ID" defer></script>

Publish your site. Custom code only runs on the published site, not in the Designer, and needs a paid site plan (it isn’t available on the free Starter plan).

Put the board on its own page

For a /feedback or /roadmap page, drag a Code Embed element onto the page and paste this:

<div id="feedback"></div>
<script src="https://getusernote.com/widget.js" data-workspace="ws_YOUR_BOARD_ID" data-mode="inline" data-target="#feedback" defer></script>

To open on the roadmap instead of the ideas list, add data-view="roadmap" to the script tag. If you also added the site-wide snippet, that page shows both the board and the Feedback button, which works fine.

No code at all: link to your hosted board

Every board has its own public page. Add a “Feedback” or “Roadmap” link to your navbar or footer pointing at it; it works on any plan, with nothing to install.

https://getusernote.com/b/ws_YOUR_BOARD_ID
https://getusernote.com/b/ws_YOUR_BOARD_ID?view=roadmap

Next steps

• Settings → Allowed websites: add your domain so nobody can embed your board elsewhere.
• Settings → Accent color: match the button to your brand.
• Turn on Require approval if you want to check ideas before they appear.

• Full install guide and options →