Skip to main content

Chat Widget

Activate and customize your WhatsApp widget to engage your visitors in real time

Introduction to the WhatsApp Widget

The Chat Widget is an interactive bubble installed on your site (mobile or desktop) that lets your visitors open a WhatsApp conversation with your brand in one click.

💡 Why it's a great entry point: the widget lets you capture visitors who are already on your site and therefore already have purchase intent or are looking for information, and shift them to a channel with a very high open and response rate.

Unlike an outbound campaign, here the conversation is initiated by the customer (inbound): they are therefore more engaged, more qualified, and generally more receptive.

Typical uses:

  • Customer support / after-sales service

  • Product advice and recommendations before purchase

  • Order tracking

  • Booking appointments or requesting information

Why activate the widget: the value of inbound

Because the conversation starts from a voluntary action by the visitor, the widget is particularly well suited to building automated flows triggered at the start of the conversation, including:

  • Diagnostic flow: a few questions to direct the visitor to the right answer or product (e.g., "What do you need help with?" → sizing, returns, order tracking, etc.)

  • Customer service flow: automatic qualification of the request (ongoing order, return, complaint) before transferring to an agent

  • Product advice flow: highlighting best-sellers, a buying guide, product FAQ

If the AI Agent is enabled on your account, the widget becomes even more powerful: the pre-filled message can directly trigger the AI agent, which handles qualification and response autonomously, 24/7, without immediate human intervention.

Example: at La Canopée, the widget redirects to a conversation handled by the AI Agent, which qualifies the visitor's request (product question, after-sales service, availability) and either responds directly or transfers to an advisor if needed.

Access and Installation

Usage recommendation:

  • Mobile site: Prioritize installing it on the mobile version of the site, since WhatsApp is mainly used on phones.

  • Desktop site: Avoid this if the WhatsApp app isn't installed on the computer, as it risks redirecting customers to a download page and causing a high bounce rate.

Widget Customization

  • Editable elements:

    • Appearance:

      • Background color

      • Widget size and height

    • Call-to-Action (CTA):

      • Text displayed on the widget's opening button

    • Visual identity:

      • Brand name

      • Brand subtitle

      • Brand image displayed on the widget

    • Custom messages:

      • Welcome text: welcome text shown when a user is redirected to WhatsApp

      • Pre-filled message: message automatically triggered in WhatsApp when a visitor clicks the widget. This is the message that will initiate the flow on the WAX side (diagnostic, customer service, product advice, AI Agent…)

⚠️ Essential step: for the widget to trigger an automated scenario, you must add this pre-filled message as an inbound message on the widget. It's this same message, once sent by the visitor, that will be picked up on the WAX side and will trigger an inbound flow (diagnostic, customer service, product advice, AI Agent…). Without this step, the message is indeed sent to WhatsApp, but no flow is triggered on arrival.

💡 The pre-filled message is the most important element to work on: it's what determines which flow or scenario is triggered at the start of the conversation.

Focus: creating the inbound flow triggered by the widget

Once the pre-filled message is configured on the widget, you need to build, on the WAX side, the flow that will be triggered when this specific message arrives in the conversation.

Steps to create it:

  1. Go to the Flow Builder and create a new flow.

  2. On the trigger block, select the "Message received" / inbound message trigger.

  3. Set the matching condition to the exact text (or a close variant) of the pre-filled message defined on the widget, so that only visitors coming from the widget enter this flow.

  4. Build the rest of the journey with the necessary blocks: response block, multiple-choice question block (List Options), condition block to direct the visitor based on their answer, transfer-to-agent block if needed.

  5. Test the flow by clicking the widget yourself from your site to verify that the pre-filled message correctly triggers the right flow.

Concrete example: diagnostic flow

  • Pre-filled message on the widget: "Hi, I need help 👋"

  • Trigger block: Message received = "Hi, I need help 👋"

  • Response block: the bot replies with a welcome message and a multiple-choice question: "What do you need help with?"

    • Order tracking

    • Question about a product

    • Return / complaint

  • Condition block: depending on the option selected, the visitor is directed to:

    • a block asking for the order number (order tracking)

    • a product FAQ block or a best-sellers showcase (product question)

    • a customer-service qualification block, then transfer to an agent (return / complaint)

🚩 If the AI Agent is enabled on the account, step 2 (trigger block) can point directly to the AI agent rather than to a manual flow, to be confirmed based on the account's configuration.

Redirection examples from our clients

Installing the Widget on your site

Click the copy code snippet button in the top right of the page.

Then insert the code into your e-commerce site, in the <head> tag of your site.

💡 Need to make a change to your widget? Make the change directly in WAX: the changes apply automatically to your site, with no need to re-copy the widget code.

Did this answer your question?