WhatsApp Bot

The WhatsApp Bot trigger enables seamless integration and creation of interactive chatbots on WhatsApp by leveraging Meta's WhatsApp Business API. It verifies and parses messaging payloads from the WhatsApp Webhook, empowering developers to build context-aware, multimedia-rich conversational experiences efficiently.

Whatsapp Bot

Checkout the full video tutorial 🍿:


Prerequisites

Before you can create a chatbot on WhatsApp, you need to have the following:

  1. A Meta developer account. Sign up for a Meta Developer Account here (opens in a new tab).
  2. A business app. Learn how to create a business app here (opens in a new tab).
  3. A verified business on Facebook. Click here (opens in a new tab) to learn how to verify your business.
  4. A registered WhatsApp business phone number.
  5. Access to the official WhatsApp Business API.

Setting up a Business App

Create a new app

After creating your Meta Developer Account, select "My App >> Create an app".

Create a new app

Select Other in "What do you want your app to do" section.

"Select Other" on What do you want your app to do section.

Select Other in "What do you want your app to do"

Select Business

"Select Business" - the type of app you want to create and use for your business.

Select Business

Create App details

Give your app a name, enter a contact email, and connect it with your business account.

Create App details

Add WhatsApp to your app

In your app, add the WhatsApp product.

Select WhatsApp product

First, you'll need to select a business profile if you already have one setup. Then continue.

Add WhatsApp to your app

Note: If you don't have a business profile set up, then you'll be met with a different screen. From here, just let the platform guide you through the process of setting up a business profile.

Create business profile

Then after adding the WhatsApp product you'll be redirected to the quickstart page

Whatsapp quickstart

Webhook Verification

To get notified of incoming messages from WhatsApp, you need to set up a webhook. Here's how you can do it:

Clone the WhatsApp Bot - Verification template

💡

Direct remix link for this step: Set up the webhook in BuildShip: In BuildShip, clone the WhatsApp webhook verification template and ship you workflow. Remix link - https://buildship.app/remix?template=whatsapp-bot-verification (opens in a new tab).

This workflow is required to verify the webhook endpoint as your setting it in the Meta dashboard. Next enter the verify token, this can be any text or number you want to use, just take note of it as you'll need it later. Then ship 🚀 your workflow and copy the endpoint URL.

Clone the WhatsApp Bot - Verification template

Save the webhook in Meta

To connect the WhatsApp API to BuildShip, you need to configure a webhook. In your Meta Developer Account, go to "WhatsApp" >> "Configuration" >> "Edit Webhook". Enter the endpoint URL you copied from step 1 as well as the verify token you saved earlier. Then click "Verify" and "Save".

Configure the webhook

Subscribe to messaging notifications

To receive all messaging events from WhatsApp in BuildShip, you need to subscribe to messaging on webhooks. Click "Manage" (Webhook fields) and subscribe to messages.

Subscribe to messaging on webhooks

Test setup with test message

First, go to "WhatsApp" >> "API Setup".

  • For the From number, select the test number that Meta provides.
  • For the To number, select a number from the recipient phone number list or add your own if not listed.
  • Then click send message to test if you're receiving a message from WhatsApp. If it works, you'll receive a Hello World message from WhatsApp.
Send test message

Using the WhatsApp Bot - Auto Reply template

To start auto replying to incoming messages, you can to clone the WhatsApp Bot - Auto Reply template from BuildShip.

Clone the WhatsApp Bot - Auto Reply template

The WhatsApp Bot - Auto Reply template uses the WhatsApp Bot trigger to verify incoming messages webhook payload from the WhatsApp Webhook by Meta. It then uses the Claude AI to automatically generate and send responses to the incoming messages.

💡

Direct remix link for this step: Set up the bot in BuildShip: In BuildShip, clone the WhatsApp Bot - Auto Reply template and ship you workflow. Remix link - https://buildship.app/remix?template=whatsapp-bot (opens in a new tab).

WhatsApp Bot - Auto Reply

Get App ID and App Secret

On the Meta dahsboard, go to your app and click App settings where you'll find your App ID and App Secret.

Get App ID and App Secret

Note: Your app must be verified by Meta before obtaining App ID and App secret.

Configuring the WhatsApp Bot trigger

Trigger Inputs:

  • Path: This field specifies the endpoint path for receiving webhook requests from the WhatsApp API. The default value is /handle-webhook.

    ℹ️

    This path needs to be the same as the path specified in the WhatsApp Verification (opens in a new tab) workflow on the Meta Developer Platform.

  • Method: This field indicates the HTTP method to be used for the webhook requests. It is set to POST, which is the required method for receiving webhook data from the WhatsApp Cloud API.

  • App ID: (mentioned in previous step) This field requires entering the App ID provided by the WhatsApp Business Manager Cloud API (opens in a new tab). It is a unique identifier for your application, displayed on top of your Meta App Dashboard.

  • App Secret: (mentioned in previous step) This field requires entering the App Secret provided by the WhatsApp Business Manager Cloud API (opens in a new tab). It is a secret key used for authentication and securing communication with the WhatsApp Cloud API.

Configuring the Claude AI Text Generator node

The Claude AI Text Generator node is used to generate automatic responses to incoming messages. You'll need to select your Anthropic API key or create a new one.

Configuring the Auto-Responder node

The Auto-Responder node is used to send the generated response to the incoming message. The only field you need to enter is the Access Token. You can use the temporary access token provided by Meta for testing purposes.

In the Meta dashboard, you can get this by going to WhatsApp >> API Setup >> Temporary access token.

Get temporary access token
ℹ️

Note that this access token is temporary and will expire after 24 hours. See creating a permanent token below for a permanent token.

Testing the bot

First, ship 🚀 your workflow.

If everything is set up correctly, you can now test the bot by sending a message to the test WhatsApp phone number which you can obtain in the Meta dashboard from WhatsApp >> API setup.

Then you should receive an automatic response generated by Claude AI ✅.

If you don't receive a response, check the workflow for any errors, and make sure you followed all the steps correctly.

Setting up a Permanent Token

To set up a permanent token, you need a Meta Business Account. Full documentation link (opens in a new tab).

  1. Create a system user: Log in to your Meta Business Account (https://developers.facebook.com (opens in a new tab)) >> "Settings" >> "Business Assets". If you've already set up your Meta Developer Account, you'll see your app and WhatsApp Test Account. Go to "Settings" >> "Business Settings" >> "System users" >> "Add". Enter a system username and system user role.

  2. Associate the system user with your app: Go to "Add Assets" >> "App". Select your app and give the system user partial or full access. Click "Save changes".

  3. Generate a new token: Click "Generate new token" >> Select your app from the dropdown menu. Make sure "whatsapp_business_messaging" and "whatsapp_business_management" are turned on. Click "Generate token".

  4. Save the token: Save the Access Token as it's not saved in Facebook. This is a permanent token that can be used for your Meta Developer app.

Need Help?

  • 💬
    Join BuildShip Community

    An active and large community of no-code / low-code builders. Ask questions, share feedback, showcase your project and connect with other BuildShip enthusiasts.

  • 🙋
    Hire a BuildShip Expert

    Need personalized help to build your product fast? Browse and hire from a range of independent freelancers, agencies and builders - all well versed with BuildShip.

  • 🛟
    Send a Support Request

    Got a specific question on your workflows / project or want to report a bug? Send a us a request using the "Support" button directly from your BuildShip Dashboard.

  • ⭐️
    Feature Request

    Something missing in BuildShip for you? Share on the #FeatureRequest channel on Discord. Also browse and cast your votes on other feature requests.