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.
Checkout the full video tutorial 🍿:
Prerequisites
Before you can create a chatbot on WhatsApp, you need to have the following:
- A Meta developer account. Sign up for a Meta Developer Account here (opens in a new tab).
- A business app. Learn how to create a business app here (opens in a new tab).
- A verified business on Facebook. Click here (opens in a new tab) to learn how to verify your business.
- A registered WhatsApp business phone number.
- Access to the official WhatsApp Business API.
Setting up a Business App
-
Sign up for a Meta Developer Account: Go to https://developers.facebook.com (opens in a new tab) and click the "Login" button. You can use your Facebook account associated with your company or create a new account.
Create a new app
After creating your Meta Developer Account, select "My App >> Create an 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 Business
"Select Business" - the type of app you want to create and use for your business.
Create App details
Give your app a name, enter a contact email, and connect it with your business account.
Add WhatsApp to your app
In your app, add the WhatsApp product.
First, you'll need to select a business profile if you already have one setup. Then continue.
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.
Then after adding the WhatsApp product you'll be redirected to the quickstart page
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.
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".
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.
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.
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).
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.
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.
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).
-
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.
-
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".
-
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".
-
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.