How to Integrate SnagRelay Widget into an HTML Website

Overview

Integrating SnagRelay into a static HTML website is straightforward. With just a few lines of JavaScript, you can add a powerful bug reporting widget that captures screenshots, session replays, console errors, and user context automatically.

Prerequisites

• A SnagRelay account (sign up free)
• Your SnagRelay API key (found in your dashboard under Settings → API Keys)
• Access to edit your HTML files

Installation

Add the Script to Your HTML

Add the following code just before the closing </body> tag of your HTML file:

<script>
    window.onSnagRelayLoad = function (api) {
        api.init();
    };
    var script = document.createElement('script');
    script.defer = 1;
    script.src = 'https://app.snagrelay.com/widget/load/YOUR_API_KEY?onload=onSnagRelayLoad';
    document.getElementsByTagName('head')[0].appendChild(script);
</script>

Replace YOUR_API_KEY with your actual API key from the SnagRelay dashboard.

Verify Installation

After adding the script:

1. Open your website in a browser
2. Look for the SnagRelay feedback button (usually in the bottom-right corner)
3. Click it to test the bug reporting flow

That's It!

The widget configuration (position, colors, button text, etc.) is managed in your SnagRelay dashboard. Any changes you make there will automatically apply to your widget.

Best Practices

• Load asynchronously — The defer attribute ensures the widget doesn't block page load
• Add to all pages — Include the script in your main template or layout file
• Test in staging first — Verify the integration works before deploying to production

Troubleshooting

Widget not appearing?

• Check browser console for JavaScript errors
• Verify your API key is correct
• Ensure the script is loaded (check Network tab in DevTools)
• Check for CSS conflicts that might hide the widget

Next Steps

Once installed, you can:

• Customize the widget appearance in your dashboard settings
• Set up integrations with Jira, Linear, GitHub, or Slack
• Configure automatic bug triage with AI
• Invite your team members

Get started with SnagRelay — Free plan available, no credit card required.