Installing Nobi

This guide covers how to install Nobi on any website. Choose the method that fits your setup: add the script directly to your HTML, or use Google Tag Manager.

On Shopify? See our dedicated Shopify installation guide for step-by-step instructions tailored to Shopify stores.

Direct Installation

If you can edit your site's HTML directly, this is the simplest approach. Add the Nobi script to your site's <head> tag:


<script async
  src="https://assistant-script.nobi.ai/nobi.bundle.js"
  onload="window.Nobi.initialize({ accountId: 'YOUR_MERCHANT_ID' });">
</script>

⚠️ Replace YOUR_MERCHANT_ID with your actual merchant ID. You can find this on the Installation page of your Nobi dashboard.

Place this snippet before the closing </head> tag on every page where you want Nobi to appear. For site-wide coverage, add it to your main layout or template file.

Installing With Google Tag Manager

If your site uses Google Tag Manager, you can install Nobi without editing your site's source code.

Click Tags in the left sidebar, then New.

Name the tag (e.g., "Nobi AI Assistant"). Click Tag Configuration and select Custom HTML.

Paste the following code into the HTML field:


<script>
  (function () {
    var scriptUrl = 'https://assistant-script.nobi.ai/nobi.bundle.js';

    function initializeNobi() {
      if (!window.Nobi || typeof window.Nobi.initialize !== 'function') {
        return;
      }

      window.Nobi.initialize({
        merchantId: 'YOUR_ACCOUNT_ID',
        autoLaunch: ['floating-chat-bar']
      });
    }

    if (window.Nobi && typeof window.Nobi.initialize === 'function') {
      initializeNobi();
      return;
    }

    var existingScript = document.querySelector('script[src="' + scriptUrl + '"]');
    if (existingScript) {
      existingScript.addEventListener('load', initializeNobi, { once: true });
      return;
    }

    var script = document.createElement('script');
    script.async = true;
    script.src = scriptUrl;
    script.onload = initializeNobi;
    document.head.appendChild(script);
  })();
</script>

⚠️ Replace YOUR_ACCOUNT_ID with your actual account ID from the Installation page of your Nobi dashboard.

Click Triggering and select All Pages to load Nobi on every page.

Click Save.

Click Submit in the top right to publish your changes.

Adding Launch Components

After installing the script, you need to add at least one launch component to give visitors a way to interact with Nobi. The simplest option is the search bar:


<nobi-search-bar
  default-mode="ai"
  size="regular"
  show-mode-toggle="false"
  show-hint-row="false">
</nobi-search-bar>

Place this HTML element wherever you want the search bar to appear on your site.

For GTM installations where you cannot add HTML elements, use the Floating Chat Bar — it requires no HTML and is configured entirely through the script initialization:


window.Nobi.initialize({
  merchantId: 'YOUR_MERCHANT_ID',
  autoLaunch: ['floating-chat-bar']
});

See the Launch Components Overview for all available components and their configuration options.

Verify Your Installation

After installing, open your site in a browser and confirm:

The Nobi search bar (or other launch component) appears on the page.

Typing a query opens the Nobi assistant and returns results.

If you have products synced, product results appear in responses.

Troubleshooting

Component not rendering: Verify the Nobi script is loaded by checking for nobi.bundle.js in your browser's Network tab. The component waits for the nobi-ready event before rendering.

Wrong or no results: Confirm your product catalog has finished syncing in the Nobi dashboard. New catalogs can take a few minutes to index.

GTM tag not firing: Use GTM's Preview mode to verify the tag fires on page load. Check that the trigger is set to "All Pages".

Console errors: Ensure your merchant ID is correct and that you haven't blocked the assistant-script.nobi.ai domain in any content security policy.

Installing Nobi Direct Installation Installing With Google Tag Manager Adding Launch Components Verify Your Installation Troubleshooting