Setting Up Your Own Chatbot – Deployment

Use these instructions to publish your Noem AI chatbot on the digital property of your choice, from a traditional website embed to WhatsApp or Slack. All deployment options start in Deploy › Deploy Tab inside your project.

What Is the Deploy Tab? #

The Deploy tab gathers every publish option for your bot—website script, CMS plugins, messaging-app webhooks, and a turnkey hosted page—plus a master list of Approved Domains that restrict where your API key is allowed to run.

Benefits of No-Code Deployment #

1. Fast go-live – Drop one script or plugin and you’re live in minutes.
2. Central control – Enable/disable targets or rotate keys from a single console.
3. Brand consistency – One bot definition powers web, mobile, and chat apps.
4. Security – Requests are accepted only from domains you approve.

Prerequisites #

• An active Noem AI chatbot project and its API Key.
• Administrator access to your web property (website CMS, DNS, Facebook Developers, Slack API, etc.).
• Optional: User-profile data if you want personalized responses.

Step-by-Step Guide #

1 Open the Deploy Tab #

1. Sign in to Noem AI › My Projects.
2. Click your chatbot, then select Deploy in the left-hand navigation.

2 Add Approved Domains #

Your bot will execute only on the domains listed here.

1. In Approved Domains, click Add Domain.
2. Enter each root or sub-domain (e.g., example.com, chat.example.com).
3. Click Save.

Tip – Wildcards are not supported; add every sub-domain explicitly.

3 Choose a Deployment Target #

Website (HTML/JS) #

Embed the bot on any HTML page.

htmlCopyEdit<!-- Include Noem AI chatbot -->
<script src="https://app.noem.ai/js/ChatBot.js"></script>
<script>
  /* (optional) current user profile */
  const currentUser = {
    userId: null,           // id or email
    displayName: 'user',
    profilePic: null,
    email: null
    // …any other user traits
  };

  /* (optional) UI / behaviour overrides */
  const nbOptions = {
    inputMessagePlaceHolderText: 'Type your message here…',
    disableCSS: false,
    disableFabButton: false
  };

  /* Instantiate and initialise */
  const bot = new ChatBot('YOUR_API_KEY', currentUser, null, nbOptions);

  /* (optional) telemetry hooks */
  // bot.onMessageSent     = msg => { … }
  // bot.onMessageReceived = msg => { … }

  /* (optional) bot-to-client events */
  bot.onEventTriggered = (event, data) => console.log(event, data);

  bot.init();
</script>

Replace YOUR_API_KEY with the key shown in Deploy › API Key.

WordPress #

1. Download the plugin ZIP: noem-bot.zip.
2. In WordPress Admin: Plugins › Add New › Upload Plugin.
3. Select the ZIP › Install Now › Activate Plugin.
4. In Noem Bot menu, paste your API Key and Save.
5. Add your site (mysite.com) to Approved Domains in Noem AI.

Wix #

1. Sign in to Wix Studio and open your site.
2. Settings › Custom Code › Add Custom Code.
3. Paste the Website script (above).
4. Name: NOEM-AI. Place Code in: Body – end.
5. Add your domain to Approved Domains.

Squarespace #

1. In Squarespace: Settings › Developer Tools › Code Injection.
2. Paste the Website script into Footer.
3. Save and publish.
4. Add your domain to Approved Domains.

Hosted Chatbot Page #

No site? Publish a branded, HTTPS-hosted page in minutes.
See Publish a Hosted Chatbot Page for the full workflow.

WhatsApp Business #

1. Go to Meta Developers › create or open your WhatsApp App.
2. Add a phone number.
3. Configuration › Webhook – paste the Callback URL and Verify Token shown in Noem AI, then Verify and Save.
4. Click Manage › subscribe to event messages.
5. In API Setup, copy Access Token and Phone Number ID into Noem AI.
6. Send a WhatsApp message to the From number to test.
   Token is valid for 23 h in sandbox; follow the Permanent Token guide.

Slack #

1. Go to https://api.slack.com/apps › Create New App › From Scratch.
2. Give it a name and pick a workspace.
3. Event Subscriptions – toggle On and enter the Request URL provided by Noem AI.
4. Under Subscribe to bot events add message.im.
5. Save Changes.
6. App Home – enable Message Tab and user posts.
7. OAuth & Permissions – copy Bot User OAuth Token into Noem AI.
   Add scopes chat:write and chat:write.public.
8. Install App to Workspace.
9. Refresh Slack; the bot should appear with its configured name and avatar.

Twilio SMS #

1. Buy a new number in Twilio.
2. Complete A2P 10DLC or other regional compliance.
3. Twilio Console › Develop › Phone Numbers › Active Numbers › select your number.
4. Configure › Messaging Configuration – set Webhook URL (shown in Noem AI) and method HTTP POST.
5. Save, then add your site (or Twilio SMS domain) to Approved Domains.
6. Send an SMS to your Twilio number; the bot should respond.

Google Tag Manager Integration #

The web embed automatically pushes events to GTM if GTM is already present.

To customise, override the hooks:

jsCopyEditbot.onMessageSent     = msg => dataLayer.push({ event:'customEvent', eventCategory:'Chatbot', eventAction:'messageSent', detail:msg });
bot.onMessageReceived = msg => dataLayer.push({ event:'customEvent', eventCategory:'Chatbot', eventAction:'messageReceived', detail:msg });

(Works with the Website / JS integration only.)

Deployment Settings Reference #

API Key: A unique key that authorizes the bot. Keep this key secret to maintain security.

Approved Domains: The list of domains allowed to initialize the chatbot script.

Callback URL / Verify Token: Required for setting up webhooks with platforms like WhatsApp and Slack.

Webhook URL (Twilio): The endpoint that Twilio will call when it receives an incoming SMS.

nbOptions: UI customization options, such as placeholder text, custom CSS, and floating action button (FAB) settings.

Managing Updates #

• Rotate API Key – Deploy › Generate New Key, update every target.
• Add domains – update Approved Domains then Save & Publish.
• Shopify / WP plugin updates – update via each platform’s app/plugin manager.
• Twilio token or webhook change – edit number configuration in Twilio.

Troubleshooting #

Bot missing in Shopify:
The app embed is not enabled.
Go to Customize › App embeds and enable Noem.ai Chatbot.

SMS not delivered:
The webhook URL is incorrect.
Make sure to copy the exact URL from the Deploy tab.

GTM events absent:
Google Tag Manager isn’t loaded on the page.
Check that the GTM container script is present and correctly installed.

403 / Invalid API Key:
The key is either missing or mis-typed.
Copy a fresh API key from the Deploy tab and try again.

Real-World Use-Cases #

• E-commerce (Shopify) – product FAQ and upsell inside every product page.
• Customer-care hotline (Twilio SMS) – answer order-status requests over text.
• Marketing microsite (Hosted Page) – QR-code campaigns with zero hosting costs.
• Website lead capture (HTML / JS) – personalise greetings with current user data.
• Internal helpdesk (Slack) – HR policies and IT troubleshooting in-workspace.

Ready to Launch? #

Pick your deployment path, paste your API key or webhook, add your domain(s), and click Publish. Your Noem AI chatbot will be live, on web, mobile, SMS, or chat apps in minutes, with no server code required.