Installing the Chatbot on Your Website

Installing the Chatbot on Your Website

Putting your chatbot on your website is a copy-and-paste job — no coding skills required. This guide walks you through grabbing the code, pasting it in the right spot, locking it to your own domains, and checking that it actually loaded.

Step 1: Copy the embed snippet

1. Open your bot.
2. Click Get code (also labeled Deploy / Embed code).
3. Copy the snippet it gives you.

The snippet is a small iframe plus a short script. The iframe is the chat widget; the script lets it grow and shrink smoothly and (optionally) receive visitor info from your page. You don't need to understand the code — just copy it exactly as given.

Step 2: Paste it before </body>

Paste the snippet into your website's HTML, just before the closing </body> tag. Putting it at the end of the page means it loads after your content, so it never slows down what visitors see first.

<!DOCTYPE html>
<html>
  <head>
    <title>My Website</title>
  </head>
  <body>
    <!-- All your page content goes here -->

    <!-- Paste the WRRK chatbot snippet right here, before </body>.
         It looks roughly like this (use the exact one from your bot): -->
    <iframe id="wrrk-widget"
      src="https://wrrk.ai/widget/YOUR_PUBLIC_KEY"
      style="position:fixed;bottom:20px;right:20px;width:56px;height:56px;border:none;z-index:9999;"
      allow="microphone" title="Chat assistant" loading="lazy"></iframe>
    <script>/* the short inline script from your bot goes here */</script>
  </body>
</html>

Use the exact snippet from your bot — the example above just shows where it goes and roughly what it looks like. If you use WordPress, Shopify, Webflow, Wix, or a similar builder, look for a "custom code" or "footer scripts" box and paste it there.

Step 3: Restrict it to your domains

So nobody can copy your widget onto a site that isn't yours:

1. Go to your bot's Appearance settings.
2. Find Allowed domains.
3. Add every domain the widget is allowed to run on (for example example.com and www.example.com).

Only pages on your allowed domains will show the widget. Leaving the list empty allows every domain — fine to start, but lock it down before you go big. This is also the first thing to check if the widget "won't appear" — a missing domain here is the usual culprit.

Step 4: Test that it loaded

1. Open your website in a browser (a fresh/incognito window avoids old cached files).
2. Look for the chat bubble in the corner.
3. Click it and send a test message to confirm the bot replies.

If nothing shows up, double-check that the snippet is before </body> and that your domain is listed in Allowed domains.

Optional: Identify logged-in users

If your site has logged-in users, you can tell the widget who they are so their chats are tied to the right person. After the widget loads, call identify:

window.wrrk.identify({
  name: 'Jane Doe',
  email: 'jane@example.com'
});

Only call this once you actually know who the user is (i.e. they're logged in). This links the conversation to their contact record, so agents see who they're talking to in the inbox and CRM. See Collecting Visitor Info & Data (Lead Capture) for the full data-capture API.

Recap

• Get code / Deploy → copy the snippet (an iframe + short script).
• Paste it before </body>.
• Add your site to Allowed domains in Appearance.
• Open the site and send a test message.
• Optionally call window.wrrk.identify({ name, email }) for logged-in users.