How to use WhatsApp Business API in my chatbot

Automate your WhatsApp conversation by using our flow builder in the Kata Platform. Create bots to reply to end-users with several bot action types:

• Text
• Image and Image with Caption
• 🎉 NEW 🎉 List Message
• 🎉 NEW 🎉 Reply Button

Bot response types

Text

About

Reply to your chatbot users (“end-users”) by sending them text as a primary response.

Here is an example of a text response to end-users.

Figure 1Action type text in WhatsApp.

How to Use

1. Go to the Kata Platform and select your project.
2. Click to Flow > Conversation Flow > State > Action List.
3. Choose Textand enter the text you want to send.
4. Click Create Action to finalize your action.

Image and Image with Caption

About

Send images to your users on WhatsApp. You can also add a caption for the image.

Here is an example of image response and using caption to end-users.

Figure 2Image with Caption Example

How to Use

1. Go to the Kata Platform and select your project.
2. Click to Flow > Conversation Flow > State > Action List.
3. Choose Image and enter the Image and Thumbnail URL.
4. The image caption is optional.
5. Click Create Action to finalize your action.

🎉 NEW 🎉 List Message

About

Send a list of options your users can choose. You can provide up to 10 options (“rows”) from a List Message.

Here is an example of a List Message response to end-users.

Figure 3The tapping button will show the options

Figure 4Show pop-up dialog menu

Composition

1. Header type

Figure 5List Message with header type “Text” and “None” in Platform

Figure 6List Message with header type “Text” and “None” in WhatsApp

2. Header composition

Figure 7List Message button composition (before showing menu list) in Platform

Figure 8List Message button composition (before showing menu list) in WhatsApp

3. Section and Row

Figure 9List Message composition (showing menu list) in Platform

Figure 10List Message composition (showing menu list) in WhatsApp

How to Use

Follow these steps to create a new List Message

1. Go to the Kata Platform and select your project.

2. Click to Flow > Conversation Flow > State > Action List.

3. Choose**List Message.**This action type only works on WhatsApp. Adding this on other channels will result in an error.

4. Fill in the fields.

5. You should know some critical notes on List Message: (1) “Section” has no limit. You can add as many sections as you want; (2)You can create up to 10 rows; (3) “Row ID” in the same section must be unique. For example:

   1. You make a section called “FAQ Topics.”
   2. Inside FAQ Topics, you have 3 rows.
   3. Those 3 rows inside FAQ Topics can’t use the same ID.

Figure 11Using similar Row ID under 1 section is not allowed

6.  Click Create Action to finalize your action

After end-users click any options, the bot must execute a response based on the clicked option. You can map the selected option by end-users using row title or row id.

• Using row title. For example:

  context.chosen == payload.postback.title
  

• Using row id. For example:

  context.chosen == payload.postback.id
  

🎉 NEW 🎉 Reply Button

About

The reply button allows users to send a reply to the chatbot quickly. In addition, you can create up to 3 buttons.

Here are examples of Reply Button responses to end-users.

Figure 12Reply button with **Text** as header

Figure 13Reply button with **Image** as header

Figure 14Reply button with **Document** as header

Figure 15Reply button with **Video** as header

How to Use

Follow these steps to create a new Reply Button.

1. Go to the Kata Platform and select your project.

2. Click to Flow > Conversation Flow > State > Action List.

3. Choose**Reply Button.**This action type only works on WhatsApp. Adding this on other channels will result in an error.

4. Fill in the fields. Some critical notes on the Reply button that you should know:

   1. “Button ID” must be unique when creating action.
   2. The maximum number of buttons is 3 buttons.
   3. Header type video only allows .mp4 extension, and we recommend the size is < 5 MB because end-users may experience slow connection when loading the video.
   4. Header types image, video, and document must use HTTP/HTTPS link.

Figure 16Reply Button composition

5. Click Create Action to finalize your action.

After end-users click any button, the bot must execute a response based on the clicked button. You can map the selected button by end-users using button title or button id.

• Using button title. For example:

  context.chosen == payload.postback.title
  

• Using button id. For example:

  context.chosen == payload.postback.id
  

How to deploy

You can create a simple bot using text by following this bot tutorial: Start your first chatbot.

You can deploy your bot by following these steps.

Create a deployment

1. Click the Deploy menu in the left sidebar.
2. On the Deploy page, click on the New Deployment button in the top right corner. It will open up the Create Deployment menu.
3. Choose any deployment version you want to deploy and fill in the changelog.

Figure 17Create a new deployment

4. Click Submit to finish the deployment.

Create a new environment

If you already have an environment created, skip these steps.

1. Go to the Deployments > Environment menu.

Figure 18Set up the environment, then set up WhatsApp channel.

2. Click the Create Environment button in any environment. You will see a drawer to create a new environment.
3. Choose the development version you want (in this tutorial, we use the 1.0.0 version)
4. Fill in the environment URL. This environment URL is used for CMS.Learn more about CMS.
5. Click Create to create the environment.
6. Created environment now has a Create Channel button.

Create WhatsApp business account

You can only deploy bots to a verified WhatsApp Business number. To get the number, you have to:

1. Go to https://business.kata.ai
2. Create a business dashboard account
3. Register your new WhatsApp number

Then, you’re ready to get the access token from your WhatsApp business account.

1. In Business Dashboard, go to the Whatsapp Numbers menu.

Figure 19WhatsApp numbers list

2. Then, click the WhatsApp number you want to deploy. You will redirect to the Manage WhatsApp Number page.
3. In the Manage WhatsApp Number page, scroll down to API Credential.

Figure 20API Credential

4. Next, you will need to downloadPostman to hit the WhatsApp API.

5. Copy the username and password from the API Credential section in the Business Dashboard into Postman.

6. Open Postman and fill in the URL as follows::

   URL: POST [https://api-whatsapp.kata.ai/v1/users/login](https://api-whatsapp.kata.ai/v1/users/login)
   

7. Enter the username and password from Business Dashboard to the Body. Examples:

   Body::
   
   {
   “username”: “amanda123”
   “password”: “Q1w2e3r4#kata”
   }
   

8. Click Send in Postman. You will get the access token as shown.

Figure 21Access token shows after hitting login API.

9. Copy the access token in the API result and save it next.

Finalize deployment WhatsApp channel

1. Log in to Kata Platform (https://platform.kata.ai)
2. Click your project that already had a chatbot and deployed
3. Then, go to the menu: Deploy > Environment.
4. Click the Create Channel button to start adding channels to the environment. It will open up the Channel menu within the environment.
5. Click the ”+ Create Channel” button in the channel table list. It will show a menu to set up the channel.
6. Choose WhatsApp in Channel Type
7. Paste the access token into the field, and enterhttps://api-whatsapp.kata.ai in the URL field.

Figure 22Fill in the access token and URL

8. Click Save to deploy your bot.

You’re all set! Now you can start chatting with your WhatsApp bot.

Figure 23Successfully deployed chatbot in WhatsApp

It is the end of the guidance. You can contact support@kata.ai if you have any difficulties when implementing this.