Product · Widget
Embeddable feedback widget
Last updated August 27, 2026 · by the Hoot team
Short answer
Two lines. A script and a mount node. The widget sits in a shadow DOM so it does not fight your CSS. Submissions land on your Hoot board. The origin is the Product URL you set — not a wildcard. Free plan gets the floating button. Pro picks the shape.
Install
Share → Widget. Copy. Paste on any page that should collect feedback.
<div id="feedback-widget"></div>
<script src="https://usehoot.app/widget.js?project=YOUR_SLUG" async></script>
Optional data-hoot-name
and data-hoot-email
prefill the form for a signed-in user. Convenience only — not verified identity.
Four shapes
- Floating button. The default pill. Bottom-right unless you move it.
- Edge tab. Flush against the left or right. You set the offset. Slimmer on a phone.
- Owl icon. A round button. The label slides out on hover.
- Hidden. No trigger. Your page calls
window.Hoot.open().
Color, size, text, and position apply to shapes that render a trigger. Hidden has nothing to color. Customization is Pro. Downgrade serves the pill again; the stored choice stays.
Hidden on purpose
If you pick hidden, Hoot will not draw a backup pill. Until the host page calls
window.Hoot.open(),
visitors have no way in. That is the point: your nav, your shortcut, not ours.
<button type="button" onclick="window.Hoot?.open()">Feedback</button>
The ?
is because the script loads async. You also get close()
and toggle().
Frequently asked questions
- What is an embeddable feedback widget?
- A small script you drop on your site so visitors can send a feature request or bug without leaving the page. Hoot's widget is two lines of HTML, runs in a shadow DOM, and posts to your project board. Requests from other origins are rejected.
- How do I add a feedback widget to my website?
- Create a Hoot project, copy the snippet from Share → Widget, and paste it on any page. The default is a floating button. Pro can switch to an edge tab, an owl icon, or a hidden widget opened with window.Hoot.open().
- Does the Hoot widget work on any stack?
- Yes. It is vanilla JavaScript. Laravel, Next, WordPress, a static HTML page — if you can paste a script tag, it mounts. Set the Product URL in Settings so CORS only allows that origin.
- Can I hide the floating button?
- On Pro, pick the hidden shape. Nothing renders on the page. Your own nav, menu, or shortcut calls window.Hoot.open(). The copied snippet includes an example button so the install is not a dead end. close() and toggle() are also on window.Hoot.
- Is the feedback widget free?
- Yes. The default floating button ships on the free plan. Color, size, position, label, and the extra shapes are Pro. The form still lands on the same board.
Drop the widget. Keep the board.
Two lines on your site. Votes, roadmap, and changelog on Hoot. Free to start.
Free plan · no card · no sales call
The widget is one door. The other is the MCP server so your agent triages what comes in. See also the best customer feedback tools of 2026.