Embed Code & Installation

Get the JavaScript snippet for your chatbot and install it on any website platform — WordPress, Shopify, Webflow, Wix, Squarespace, or custom HTML.

Publishing Your Chatbot

1

Click Publish

In the chatbot editor, click the "Publish" button in the header. This opens the Website Integration dialog.

2

Enable Website Integration

Toggle "Enable Website Integration" to activate the embed code.

3

Add Your Domain

Add your website domain to the allowed domains list in organization settings. This is a security measure to prevent unauthorized embedding.

4

Copy the Embed Code

Copy the JavaScript snippet provided in the integration dialog.

Website Integration dialog showing embed code
The Website Integration dialog with JavaScript embed code

The Embed Code

The embed code looks like this:

<script>
(function () {
  // Define chatbot configuration
  window.userChatbotConfig = {
    chatbotId: "a5617384-0225-4c5a-9528-eefab4leald8",
    privateKey: "YTU2MTc...",
  };
  // Dynamically load chatbot plugin
  const chatbotScript = document.createElement("script");
  chatbotScript.src = "https://chatjs.hyperleap.ai/chatbot.min.js";
  chatbotScript.async = true; // Load asynchronously for better performance
  document.head.appendChild(chatbotScript);
})();
</script>

Installing on Your Website

Paste the embed code just before the closing </body> tag of your website. The exact method depends on your website platform:

WordPress

Via Theme Editor or Headers & Footers plugin

Shopify

Edit theme.liquid in Layout folder

Webflow

Project Settings → Custom Code

Wix

Settings → Custom Code → Body end

Squarespace

Settings → Code Injection → Footer

Custom HTML

Paste before </body> tag

WordPress

  1. Go to Appearance → Theme Editor (or use a plugin like "Insert Headers and Footers")
  2. Find your theme's footer.php file
  3. Paste the code before </body>
  4. Save changes

Shopify

  1. Go to Online Store → Themes → Edit Code
  2. Find theme.liquid in the Layout folder
  3. Paste the code before </body>
  4. Save

Webflow

  1. Go to Project Settings → Custom Code
  2. Paste in the Footer Code section
  3. Publish your site

Wix

  1. Go to Settings → Custom Code
  2. Click "Add Custom Code"
  3. Paste the code, select "Body — end" placement
  4. Apply to "All pages"
  5. Save

Squarespace

  1. Go to Settings → Advanced → Code Injection
  2. Paste in the Footer section
  3. Save

Custom HTML

Simply paste the code before </body> in your HTML file(s).

Tip:
The script loads asynchronously, so it won't slow down your page load. The chatbot appears once the script is fully loaded.

Domain Whitelist

For security, your chatbot only works on whitelisted domains. You must add your domain before the embed code will work. See the Whitelisting Domains guide for step-by-step instructions.

Note:
This is a critical step — without whitelisting your domain, the chatbot will not appear on your website.

Preview vs. Production

  • Preview — Click "Preview" in the integration dialog to test on a temporary URL
  • Integration Docs — Click for detailed platform-specific guides