Embed Chatbot

Website Platform

Use this generic code snippet to embed the chatbot on any standard website.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

WordPress

To embed the chatbot on your WordPress site, choose one of these detailed methods:

Option 1 – Theme Editor:

• Log in to your WordPress dashboard (e.g., yoursite.com/wp-admin).
• Navigate to Appearance > Theme File Editor in the left sidebar.
• Find and click footer.php for your active theme.
• Scroll to the bottom and locate the </body> tag.
• Paste the script directly above it.
• Click Update File to save.

Option 2 – Plugin Method:

• Go to Plugins > Add New and search for “Insert Headers and Footers.”
• Install and activate the plugin.
• Navigate to Settings > Insert Headers and Footers.
• Scroll to the “Scripts in Footer” box, paste the script, and click Save.

Verification:

• Visit your site, refresh the page (Ctrl+F5), and look for the chatbot.
• If it doesn’t appear, clear any caching and double-check the script placement.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Wix

To add the chatbot to your Wix site, follow these steps:

• Log in to your Wix account at wix.com and select your site from the dashboard.
• Click Edit Site to open the Wix Editor.
• On the left sidebar, click the + (Add) button.
• Scroll to Embed Code and select Embed HTML.
• Drag the HTML box to where you want the chatbot (e.g., bottom-right corner).
• Click the box, then select Edit Code in the pop-up.
• Paste the script into the code field (ensure the “HTML” mode is active).
• Click Update to save the embed.
• Click Preview to test, then Publish to go live.

Note: If the chatbot doesn’t appear, verify that your site isn’t cached and that the script URL is working.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Magento (Adobe Commerce)

To embed the chatbot in Magento, choose one of the methods:

Admin Panel Method:

• Log in to your Magento Admin Panel (e.g., yoursite.com/admin).
• Navigate to Content > Design > Configuration in the left sidebar.
• Select your active theme (e.g., “Luma”) and click Edit.
• Expand the Footer section, locate the Miscellaneous HTML field, and paste the script.
• Click Save Configuration and then clear cache via System > Cache Management.

Advanced Option:

• Edit app/design/frontend/[Vendor]/[Theme]/Magento_Theme/layout/default.xml and add the following before </body>:
  Copy

  <referenceContainer name="before.body.end">
    <block class="Magento\Framework\View\Element\Text" name="chatbot">
      <action method="setText">
        <argument name="text" xsi:type="string"><![CDATA[<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>]]></argument>
      </action>
    </block>
  </referenceContainer>

• Run bin/magento setup:upgrade and bin/magento cache:flush via SSH.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Squarespace

To embed the chatbot in Squarespace, choose one of the methods:

For a Specific Page:

• Log in to your Squarespace account at squarespace.com.
• Go to Pages and select your target page (e.g., “Home”).
• Hover over the page content, click Edit, and then click the + (Add Block) icon.
• Select Code, paste the script into the code box, ensure “HTML” is selected, and uncheck “Display Source.”
• Click Apply.

For Sitewide Use:

• Go to Settings > Advanced > Code Injection.
• Scroll to Footer, paste the script, and click Save.
• Open your site in a new tab, refresh (Ctrl+F5), and verify the chatbot loads.

Note: If it doesn’t load, verify the script URL and check for any Squarespace security settings.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

GoDaddy Website Builder

To embed the chatbot with GoDaddy Website Builder, follow these steps:

• Log in to your GoDaddy account at godaddy.com and click My Products > Websites + Marketing > Edit Site.
• Select the page where you want the chatbot (e.g., homepage).
• Click Add Section from the right sidebar.
• Scroll to HTML under “Advanced” and click Add.
• Drag the HTML section to your preferred spot (e.g., footer area).
• Click the section, paste the script into the Custom Code field, and click Done.
• Click Preview to test, then Publish to update your site.

Note: If the chatbot doesn’t appear, ensure you’re not on a restricted plan and test in an incognito window.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Webflow

To embed the chatbot in Webflow, choose one of the methods:

For a Specific Page:

• Log in to webflow.com and open your project in the Designer.
• Select your page from the Pages panel (e.g., “Home”).
• Click the + (Add Elements) icon, scroll to Components, and drag an Embed element onto your canvas.
• Double-click the embed, paste the script, and click Save & Close.

For Sitewide Use:

• Click the Project Settings (gear icon) in the left sidebar.
• Go to Custom Code, scroll to Footer Code, paste the script, and click Save Changes.
• Publish your site and clear your browser cache (Ctrl+Shift+R) to verify the chatbot loads.

Note: If it fails, ensure the script URL is HTTPS and test it independently.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Weebly

To embed the chatbot in Weebly, choose one of the methods:

For a Specific Page:

• Log in to weebly.com and open your site in the editor.
• Click Pages in the top bar and select your page (e.g., “Home”).
• Drag the Embed Code element from the left sidebar to your page (e.g., footer area).
• Click the element, choose Edit Custom HTML, paste the script, and click outside to save.

For Sitewide Use:

• Go to Settings > SEO in the top bar.
• Scroll to Footer Code, paste the script, and click Save.
• Click Publish and refresh your site (Ctrl+F5) to verify the chatbot appears.

Note: Ensure your plan supports custom code and that the script URL is valid.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

SiteBuilder

To embed the chatbot with SiteBuilder, follow these steps:

• Log in to your SiteBuilder account at sitebuilder.com and select your site.
• Open the editor and navigate to your desired page (e.g., homepage).
• Click Add New Section from the toolbar.
• Choose HTML/CSS (or a custom code widget) and drag it to your page.
• Paste the script into the code field and click Save.
• Click Publish and then visit your site in an incognito window to confirm the chatbot loads.

Note: Ensure your plan includes custom code support.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Next.js

To embed the chatbot in Next.js, choose one of the methods:

Sitewide Method:

• Open your Next.js project in a code editor (e.g., VS Code).
• If pages/_document.js doesn’t exist, create it with the basic HTML structure.
• Add the script before the </body> tag:
• Save your changes.

Page-Specific Method:

• Open a page (e.g., pages/index.js) and import Script from next/script.
• Add the following code below your component:
  Copy

  <Script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX" strategy="afterInteractive" />

• Test locally with npm run dev, then build and start for production.
• Visit your site, clear cache (Ctrl+Shift+R), and verify the chatbot loads.

Note: Ensure the script URL is correct and not blocked.

<script src="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Drupal

To embed the chatbot in Drupal, choose one of the methods:

Theme Method:

• Log in to your Drupal admin panel (e.g., yoursite.com/user).
• Go to Appearance and click Settings for your active theme.
• Paste the script in the Footer area of your theme’s template (or edit html.html.twig to add it before </body>).
• Save your changes.

Block Method:

• Go to Structure > Block Layout and click + Add Custom Block.
• Create a Basic Block, title it (e.g., “Chatbot”), and paste the script (set to “Full HTML”).
• Assign the block to the desired region (e.g., “Footer”) and save.
• Clear caches via Configuration > Performance > Clear All Caches and refresh your site.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Bubble

To embed the chatbot in Bubble, follow these steps:

• Log in to bubble.io and open your app in the editor.
• Select the page where you want the chatbot (e.g., “index”).
• Drag an HTML element from the UI Builder onto your canvas (e.g., bottom-right corner).
• Click the HTML element, paste the script into the HTML content box, and ensure “This content is dynamic” is unchecked.
• Adjust its size and position as needed.
• Click Preview to test, then deploy via Deploy > Deploy to Live.
• Visit your live app, refresh (Ctrl+F5), and verify the chatbot appears.

Note: Ensure the script URL is HTTPS and not blocked.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Shopify

To embed the chatbot in Shopify, follow these steps:

• Log in to your Shopify admin (e.g., yourstore.myshopify.com/admin).
• Go to Online Store > Themes in the left sidebar.
• Select your active theme and click Actions > Edit Code.
• Under “Layout,” open theme.liquid.
• Scroll to the bottom, find </body>, and paste the script above it.
• Click Save and then clear your browser cache (Ctrl+F5) to verify the chatbot loads.

Note: If the chatbot doesn’t load, ensure no conflicting apps are overriding it.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Jimdo

To embed the chatbot in Jimdo, choose one of the methods:

Sitewide Method:

• Log in to jimdo.com and select your site from the dashboard.
• Click Menu (top-left), then go to Settings > Edit Head.
• Paste the script in the Head field and click Save.

Page-Specific Method:

• Open the editor and navigate to your desired page (e.g., “Home”).
• Click Add Element (+ icon), choose More Elements and select HTML.
• Paste the script in the HTML box, then click Save and position the element as needed.
• Click Publish and refresh your site (Ctrl+F5) to verify the chatbot loads.

Note: Some Jimdo plans limit custom code, so ensure your plan supports it.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

HubSpot CMS Hub

To embed the chatbot in HubSpot CMS Hub, choose one of the methods:

Sitewide Method:

• Log in to hubspot.com and go to Settings > Website > Pages.
• Scroll to Site Footer HTML, paste the script, and click Save.

Page-Specific Method:

• From the dashboard, click Marketing > Website > Website Pages and select your page.
• In the editor, click + Add Module, search for Custom HTML, and drag it to your page.
• Paste the script into the module’s code box, then click Apply Changes and Publish.

Note: If the chatbot doesn’t load, check for conflicting HubSpot modules and test the script URL.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Concrete5

To embed the chatbot in Concrete5, choose one of the methods:

Theme Method:

• Log in to your Concrete5 dashboard (e.g., yoursite.com/index.php/dashboard).
• Go to Dashboard > Themes and click Customize on your active theme.
• Edit footer.php (located in application/themes/[theme]/), paste the script before </body>, and upload the file.

Block Method:

• Go to Dashboard > Stacks & Blocks > Blocks and click + Add Block.
• Select HTML, title it (e.g., “Chatbot”), paste the script, and save.
• Edit your page via Dashboard > Pages & Themes > Full Site Map and drag the block to your desired region (e.g., Footer).
• Clear the cache via Dashboard > System & Settings > Clear Cache and refresh your site.

Note: If the chatbot doesn’t load, verify file permissions and the script URL.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Ghost

To embed the chatbot in Ghost, choose one of the methods:

Sitewide Method:

• Log in to your Ghost admin (e.g., yoursite.com/ghost).
• Click Settings > Code Injection in the left sidebar.
• Scroll to Site Footer, paste the script, and click Save.

Theme Method:

• Go to Settings > Design > Change Theme and download your active theme (e.g., “Casper”).
• Edit default.hbs to paste the script before </body>, then save and zip the theme.
• Upload and activate the updated theme.
• Visit your blog, refresh (Ctrl+F5), and verify the chatbot loads.

Note: If it doesn’t load, check that caching (e.g., Cloudflare) isn’t hiding your changes.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Joomla!

To embed the chatbot in Joomla!, choose one of the methods:

Template Method:

• Log in to your Joomla admin (e.g., yoursite.com/administrator).
• Go to Extensions > Templates and click your active template (e.g., “Protostar”).
• Click Edit, open index.php, and paste the script before </body>.
• Save your changes.

Module Method:

• Go to Extensions > Modules, click New, and select Custom.
• Title the module (e.g., “Chatbot”), paste the script in HTML mode, and save.
• Assign the module to the desired position (e.g., Footer) and to all pages via Menu Assignment.
• Clear caches via System > Clear Cache and refresh your site.

Note: Ensure the template/module is active and test the script URL.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Blogger

To embed the chatbot in Blogger, choose one of the methods:

Sitewide Method:

• Log in to blogger.com and select your blog from the dashboard.
• Click Theme in the left sidebar, then click Edit HTML.
• Search for </body> and paste the script just above it.
• Click Save Theme.

Page-Specific Method:

• Go to Pages, edit your desired page (e.g., “About”), and switch to HTML View.
• Paste the script and click Update.

Note: Ensure no browser extensions block scripts and test the script URL.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Mobirise

To embed the chatbot in Mobirise, choose one of the methods:

Page-Specific Method:

• Open Mobirise and load your project.
• Select your page from the Pages panel.
• Click + (Add Block), scroll to Code Editor or HTML Block, and add it to your page.
• Click the block, paste the script in the HTML field, and click Apply.

Sitewide Method:

• Go to Site Settings (gear icon) and click Edit Site Styles.
• Scroll to Footer Code, paste the script, and save.
• Click Preview, then Publish or export your site.
• Refresh your site (Ctrl+F5) to confirm the chatbot loads.

Note: Ensure the script URL is HTTPS and not blocked by your hosting provider.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Hugo

To embed the chatbot in Hugo, follow these steps:

• Open your Hugo project in a code editor.
• Navigate to layouts/partials/footer.html (create it if it doesn’t exist) and add:
  Copy

                "<script src="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>" | safeHTML

• Ensure layouts/_default/baseof.html includes partial "footer.html" . before </body>.
• Test locally with hugo server, then build and deploy.

Note: If the chatbot doesn’t load, check for any errors and verify the script URL.

"<script src="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>"

Carrd

To embed the chatbot in Carrd, follow these steps:

• Log in to carrd.co and open your site in the editor.
• Click + (Add Element) in the top-right, scroll to Embed, and add it to your page.
• Click the embed, set the Type to Code, paste the script in the code field, and press Enter.
• Adjust its position as desired (for example, fixed bottom-right via positioning settings).
• Click Preview, then Save and Publish.
• Refresh your live site (Ctrl+F5) to verify the chatbot loads.

Note: If issues occur, ensure the script URL is HTTPS.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Duda

To embed the chatbot in Duda, choose one of the methods:

Page-Specific Method:

• Log in to duda.co and open your site in the editor.
• Select your page from the Pages panel.
• Drag the HTML widget from the left sidebar to your page (e.g., footer area).
• Double-click the widget, paste the script into the code box, and click Update.

Sitewide Method:

• Click Site Settings (gear icon, top-right) and select Custom Code.
• Paste the script in the Body section just before </body> and click Save.
• Click Preview, then Publish.
• Refresh your live site (Ctrl+F5) to confirm the chatbot loads.

Note: Ensure your plan supports custom code and verify the script URL.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Blocs

To embed the chatbot in Blocs, choose one of the methods:

Page-Specific Method:

• Open Blocs on your Mac and load your project.
• Select your page from the Page Navigator.
• Click + (Add Block), search for Code Widget, and add it to your page (e.g., footer).
• Click the widget, paste the script in the HTML field, and click Apply.

Sitewide Method:

• Go to Project Settings (gear icon at the bottom-left) and select Code.
• Paste the script in the Footer Code section and click OK.
• Click Preview to test, then export your site.
• Refresh your live site (Ctrl+F5) to confirm the chatbot loads.

Note: Ensure the script URL is correct and not blocked by your server’s security settings.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>

Zyro

To embed the chatbot in Zyro, choose one of the methods:

Page-Specific Method:

• Log in to zyro.com and open your site in the editor.
• Select your page from the page list (top).
• Click Add Section (the + icon), choose Embed Code, and drag it to your page (e.g., footer).
• Click the section, paste the script into the code field, and click Save.

Sitewide Method:

• Click Settings (gear icon, top-right) and go to Integrations > Custom Code.
• Paste the script in the Footer section and click Save.
• Click Preview, then Publish.
• Refresh your live site (Ctrl+F5) to verify the chatbot loads.

Note: Ensure your Zyro plan supports custom code and test the script URL if necessary.

<script crossorigin data-name="nxus" src="https://cdn.undercom.ai/static/js/embed.min.js" data-cid="https://www.undercom.ai/scripts/chat-bot/XXX-XXX-XXX"></script>