WhatsApp Chatbot + Website Widget: Automate Support on Every Channel with JestBot
Two channels, one brain
Ask ten businesses which channel their customers prefer and you'll get two answers, split roughly down the middle. New visitors browsing your site want an instant answer without downloading anything or saving a contact — that's the website widget's job. Existing customers, especially in markets where WhatsApp is the default messaging app, want to message you the same way they message everyone else. JestBot connects to both, and — critically — both run off the exact same trained bot, so a customer gets the same quality of answer no matter which one they pick.
The old way of doing WhatsApp support
Before AI bots were practical, WhatsApp Business support usually meant one of two things: a human manually replying from a shared inbox app, or a rigid keyword-based flow ("reply 1 for sales, 2 for support") that broke the moment a customer typed a real sentence instead of a menu number. Neither scales, and neither actually understands what the customer is asking. Add a busy sales day or a product launch, and the shared inbox turns into a queue nobody can keep up with, while the keyword flow just loops the customer through the same three menu options until they give up.
Connecting WhatsApp the right way
JestBot connects to the WhatsApp Cloud API through an embedded signup flow, so you can link your existing WhatsApp Business number in a few clicks — no manual token juggling, no digging through Meta's Business Manager to find the right App ID. The embedded signup handles the OAuth handshake, phone number verification, and webhook subscription for you.
// Simplified: kicking off WhatsApp embedded signup for a bot
const signupUrl = await whatsappEmbeddedSignupService.getSignupUrl({
botId,
redirectUri: "https://app.jestbot.ai/whatsapp/callback",
});
// Redirect the merchant to signupUrl to authorize their WhatsApp numberOnce authorization completes, JestBot receives a webhook confirming the phone number and business account, stores the credentials against your bot, and the number is live. There's no waiting period, no manual review queue on our side — as soon as Meta confirms the authorization, messages start flowing.
How an inbound WhatsApp message is handled
Every inbound message from a customer hits a webhook, gets matched to the right bot by phone number, runs through the same retrieval and tool-calling pipeline used everywhere else in JestBot, and the reply is sent back through the Cloud API.
// Simplified WhatsApp webhook handler
router.post("/whatsapp/webhook", async (req, res) => {
const { from, text, botPhoneNumberId } = parseWhatsAppPayload(req.body);
const bot = await botService.findByPhoneNumberId(botPhoneNumberId);
const reply = await botService.generateReply({ botId: bot._id, channel: "whatsapp", from, text });
await whatsappSender.send(from, reply);
res.sendStatus(200);
});Because this runs through the same bot service as every other channel, any tool the bot has access to — checking stock, creating a lead, booking a meeting — works exactly the same way on WhatsApp as it does on the website.
Dropping the widget onto your site
The widget is a single script tag. It loads asynchronously so it never blocks your page's initial render, and it opens a chat bubble that talks to your bot's API over a lightweight session.
<script
src="https://cdn.jestbot.ai/widget.js"
data-bot-id="YOUR_BOT_ID"
async
></script>The widget picks up your bot's configured name, avatar, and color scheme automatically, so it looks like part of your site rather than a bolted-on third-party tool. You can also pass optional attributes to control where the bubble sits, whether it opens automatically after a delay, and what the greeting message says.
Customizing the widget's look and behavior
Beyond the basic embed, the widget supports a handful of behaviors worth knowing about: a proactive greeting that opens after a configurable delay to nudge an engaged visitor into a conversation, quick-reply buttons under the bot's first message for common questions, and a position override for sites where the default bottom-right corner conflicts with another element like a cookie banner or a support button from a different tool.
<script
src="https://cdn.jestbot.ai/widget.js"
data-bot-id="YOUR_BOT_ID"
data-position="bottom-left"
data-proactive-delay="15000"
async
></script>Shared context between channels
When a customer is identifiable across channels — for example, they've logged in on your site and also message you on WhatsApp using a phone number tied to their account — JestBot can link those conversations so the bot has the fuller picture instead of treating every channel as a stranger. A customer who asked about a refund on the website and then follows up on WhatsApp doesn't have to explain the situation twice.
Business hours and human handover
Automation shouldn't mean customers are stuck talking to a bot when they clearly need a person. JestBot can detect frustration or explicit requests for a human, and route the conversation to an available agent. Outside business hours, it can queue the conversation and let the customer know when to expect a reply, on both WhatsApp and the widget.
// Simplified handover trigger
if (handoverIntent.detect(userMessage) || sentiment.isFrustrated(userMessage)) {
await handoverService.escalate({ conversationId, reason: "customer_requested_human" });
}Canned responses and consistency
For questions that come up constantly — shipping timelines, refund windows, business hours — JestBot supports canned responses that agents can insert instantly during a handover, keeping the tone consistent between what the bot said automatically and what the human says next. This matters more than it sounds: a customer who gets a warm, on-brand automated reply and then a curt, differently-worded human reply notices the seam immediately.
Analytics across both channels
Because WhatsApp and the widget both flow through the same bot, your analytics dashboard shows combined numbers: total conversations, messages per month against your plan limit, common questions, and handover rate — broken down by channel so you can see whether WhatsApp or the widget is doing more of the work, and where each channel's customers tend to need a human.
Common pitfalls to avoid
- Uploading outdated documents and expecting the bot to know the difference — the bot only knows what's in the knowledge base right now
- Turning on WhatsApp before testing the bot thoroughly on the widget, where mistakes are cheaper to catch
- Not setting business hours, so customers get an automated reply at 2am when they actually needed a human follow-up in the morning
- Forgetting to add tags and canned responses that make human handover fast when it does happen
- Leaving the widget's proactive greeting too aggressive, which can feel intrusive on a first-time visitor
Notifications and message templates on WhatsApp
WhatsApp's platform draws a distinction between a reply inside an open conversation window and a message you initiate outside that window — the latter requires a pre-approved message template, which is a Meta requirement rather than a JestBot one. JestBot handles submitting and managing these templates for you, so when your bot needs to proactively reach out — an order status update, an abandoned-cart nudge, an appointment reminder — it can send a properly formatted template message instead of the conversation silently failing because the customer hasn't messaged recently. Understanding this distinction matters if you plan to use WhatsApp for anything beyond reactive support, since template approval can take a day or two the first time you submit one.
Multiple bots, multiple numbers
Larger businesses, or agencies managing several client accounts, often need more than one WhatsApp number or more than one widget — for different brands, different regions, or different clients entirely. JestBot supports running multiple bots under one account, each with its own knowledge base, WhatsApp number, and widget, so a single dashboard can manage several distinct customer-facing bots without any of their knowledge or conversation history bleeding into each other.
Language support and localization
Customers messaging on WhatsApp often write in a mix of languages within the same conversation, switching between English and a regional language mid-sentence — something rigid keyword bots handle badly. Because JestBot's underlying model understands natural language rather than matching fixed phrases, it can follow that kind of code-switching and reply in whichever language the customer is using, drawing on the same knowledge base regardless of the language the conversation is happening in. The website widget supports the same behavior, so a visitor typing in a regional language gets a coherent reply instead of a generic "please use English" message.
A quick before-and-after
Picture a small clothing brand before JestBot: a website contact form nobody checks until the next morning, a WhatsApp number one person answers between other tasks, and a habit of losing track of who already asked about a specific order. After connecting both channels to one bot: a visitor asks about a size on the website at 11pm and gets an instant, accurate answer from the actual size chart document instead of a form that goes nowhere. A regular customer messages on WhatsApp the next day asking to track that same order, and because the bot recognizes the returning customer, it can jump straight to the tracking answer instead of re-asking for the order number. The person who used to spend their afternoon answering the same five questions over and over is now only pulled in for the handful of conversations that actually need a human — refund edge cases, custom requests, escalations.
Frequently asked questions
Can I use my existing WhatsApp Business number? Yes — the embedded signup flow links your existing number rather than requiring a new one.
Will the widget slow down my website? The script loads asynchronously and doesn't block your page's initial render, so it shouldn't affect load-time metrics in any meaningful way.
Do WhatsApp and the widget share the same conversation history for a customer? When a customer is identifiable on both channels (for example, a logged-in user whose phone number matches their WhatsApp), yes — otherwise each channel starts its own conversation thread.
Does the bot handle customers switching languages mid-conversation? Yes — because it understands natural language rather than matching fixed keywords, it can follow a conversation that mixes languages and reply appropriately.
Getting started
Set up the widget first, since it's the fastest way to validate the bot's answers with real traffic. Once you're happy with its accuracy, connect WhatsApp through the embedded signup flow and let the same bot pick up conversations there — no extra training, no separate configuration, just a second channel for the same brain. Watch the first few dozen real conversations closely on both channels, correct anything the bot gets wrong by updating the knowledge base rather than manually overriding individual replies, and only then start layering on tool calling, the calling agent, or the mobile SDK once you trust the foundation these two channels are built on.