How to add a bug report button to your website

The short answer: add one script tag. It puts a small "Report a bug" button on your pages that opens a form and attaches the page, browser and recent console errors for the user. This guide covers setup, telling reports apart by user, and replying.

What makes a website bug report useful?

The page URL where it happened.
Browser, OS and window size, since many web bugs only show up in one of them.
Recent console errors, which the user can't see but usually point at the cause. The browser reports uncaught ones through the window error event; the widget keeps the latest for the report.
Who the user is, if they're signed in.
A way to reply, so you can ask for steps or tell them it's fixed.

Step 1: Create an app in StareGlare

Contact us for a workspace and create an app for your site. Its Install tab has a widget configurator with a live preview.

Step 2: Paste the script tag

Add this before </body>, with your app's slug:

<script src="https://stareglare.com/widget.js" data-app="your-app" async></script>

Options are data- attributes: color, label, left or right position, light or dark theme, a keyboard shortcut, and whether to capture console errors or the full page URL. The configurator writes them for you, and the widget reference lists every one. The button and the form follow your page's <html lang> in 17 languages (English, Spanish, French, German, Portuguese, Italian, Dutch, Polish, Russian, Turkish, Japanese, Chinese, Korean, Macedonian, Serbian, Albanian and Bulgarian), or set data-lang to pick one.

The popup has five layouts, set with data-layout: form (the default, every field on one screen), assistant (a support chat that offers the kind and the closest topic as buttons to tap, and asks for a few words only where they help), composer (one message box), guided (one question at a time) and home (a welcome screen with a row per kind of report). The chat layouts end with an offer of email updates and a screenshot. Replies still go by email, so nobody is left waiting for an answer in the popup.

To make it yours: data-icon picks the button's icon (chat, bug, idea, question, megaphone, none or an https:// image), data-size and data-radius shape the button, data-popup-color sets the colour used inside the popup (it is your app's colour otherwise), data-title, data-avatar and data-greeting set the popup's header and first message, data-kinds limits what people can send (for example data-kinds="feedback"), and data-width and data-height size the popup.

Step 3: Identify users and add context

// Who is reporting (after sign-in):
Snag.identify({ email: user.email, name: user.name });

// Extra details attached to every report:
Snag.setContext({ plan: "pro", build: "2026.10.2" });

// Open the form from your own menu item:
Snag.open();

// Or open it with fields filled in, for a "submit a store" page:
Snag.open({ kind: "feedback", title: "New store: ", context: { source: "new-store" } });
// The same without script: <button data-snag-open data-snag-kind="feedback"
//   data-snag-title="New store: " data-snag-source="new-store">Submit a store</button>

Step 4: Send a test report and reply

Click the button and send a report. It shows up in your inbox with the page and browser details. If the reporter left an email, your reply reaches them by email and their answer threads back into the same report.

Step 5: Catch what nobody reports

Add data-errors="auto" to the same tag and uncaught errors arrive on their own, grouped and counted. See how to track JavaScript errors. When the reports pile up, Claude can fix them and write back to each person.

Questions

How do I add a bug report button to my website?

Paste one script tag before </body>. The StareGlare widget adds a floating "Report a bug" button that opens a short form and attaches the page URL, browser details and recent console errors to the report.

Does it work with React, Svelte, Vue or a static site?

Yes. It is a plain script tag with no dependencies, so it works on static sites, server-rendered pages and single-page apps alike. In a SPA, call Snag.open() from your own button if you hide the default one.

Can I pass the signed-in user so I know who reported the bug?

Yes. Call Snag.identify({ email, name }) after sign-in. Add app state with Snag.setContext({ plan: "pro" }); it is attached to every report.

Does it work with a Content-Security-Policy?

Yes. The widget uses no inline scripts or eval. Allow stareglare.com in script-src, frame-src and img-src (the button icon), and in connect-src if you turn on automatic error capture.

Can the widget look like a support chat instead of a form?

Yes. Set data-layout to assistant, composer, guided or home. The assistant layout asks what the person needs and offers the answers as buttons, then asks for a few words only where they help. Replies still go by email, so nobody waits in the popup.

Related guides

All 6 guides, from the first report to the fix.