The widget is a single script tag. If your site lets you add code to your pages, it will work.
First, copy your embed code from Website under Connect. See Turn the widget on and copy your code.
Steps
- Open your website’s HTML. Use the HTML editor in your content management system, or open your HTML file directly.
- Paste the code. Put it inside the
<head>section, or just before the closing</body>tag. Both work. - Save and publish. The chat bubble appears on your site automatically.
Where to paste it, exactly
<head>
<!-- your existing tags -->
<script async src="https://app.respondhelper.com/api/widget/YOUR_WIDGET_ID/script.js"></script>
</head>
Add it to a shared layout, template or include file so it covers every page. On a hand built site that usually means one file every page loads, often a header include. Pasting it into every page individually works but you will forget one.
Platform specific notes
Ghost: Settings, then Code injection, then Site header.
Framer: Project settings, then General, then Custom code, then End of head tag.
Carrd: Site settings, then Code, in the head field. Requires a Pro plan.
Google Sites: Not supported. Google Sites does not allow custom scripts.
A React, Vue or Next.js app: Add the script tag to your root HTML template, or your framework’s document or head component. It does not need to be a component, and it should load once for the whole app rather than per route.
Check it worked
Open your site in a private browsing window and look at the bottom right corner.
If it does not appear
Work through The chat bubble is not showing on my site.