Create and send WhatsApp Flows

Use WhatsApp Flows to create end-to-end custom workflows. These workflows enable the end users to perform tasks, such as filling out forms, without leaving the chat with your business.

This tutorial explains how to create and send WhatsApp Flows to end users.

Products and channels

• Answers
• WhatsApp

Prerequisites

• Infobip account with WhatsApp enabled.
  • If you do not have an account, create a free trial account and select WhatsApp as the channel on the welcome screen.
• A WhatsApp sender that is registered with Infobip.
• WhatsApp business account.

Process overview

You can send WhatsApp Flows either over the Infobip Web interface or over API.

Over the Infobip Web interface

1. In Meta playground, create the WhatsApp Flow. JSON is created.
2. In WhatsApp Manager, create an outline of the WhatsApp Flow.
3. In WhatsApp Manager, use the JSON to update the WhatsApp Flow with the components and elements that you created in the Meta Playground.
4. Test the WhatsApp Flow in Draft mode.
5. Publish the WhatsApp Flow.
6. Add the WhatsApp Flow to the Answers chatbot and send it to end users.

Over API

1. In Meta playground, create the WhatsApp Flow. JSON is created.
2. In the WhatsApp API, create an outline of the WhatsApp Flow.
3. In the WhatsApp API, use the JSON to update the WhatsApp Flow with the components and elements that you created in the Meta Playground.
4. Test the WhatsApp Flow in Draft mode.
5. Publish the WhatsApp Flow.
6. Send the WhatsApp Flow to end users.

Implementation over the Infobip Web interface

Complete the steps in each of the following sections sequentially.

Create a WhatsApp Flow in Meta Playground

1. Go to Meta playground (opens in a new tab) and create a WhatsApp Flow based on your use case.
2. To add new screens to the WhatsApp Flow, select Add new.
3. To add new components, select Add content.
4. Configure the components based on your use case.
5. After you finish designing the WhatsApp Flow, JSON is automatically created and is ready to use. Select Copy Flow JSON.

Create an outline of the WhatsApp Flow in WhatsApp Manager

1. Log on to WhatsApp Manager.

2. Go to Business settings > WhatsApp accounts.

3. Filter by WhatsApp business account ID.

4. Select WhatsApp Manager > Flows > Create Flow.

   

5. Enter the name of the WhatsApp Flow.

6. Select the category based on your use case.

7. You can create either a static or dynamic WhatsApp Flow. This tutorial shows how to create a static WhatsApp Flow. Select Without endpoint.

   Note

   To create a dynamic WhatsApp Flow, select With endpoint.

8. Select Default.

9. Complete all the fields and select Create.

The WhatsApp Flow is created in Draft status.

Configure the WhatsApp Flow in WhatsApp Manager

Update the WhatsApp Flow so that it contains the components and elements that you created in the Meta Playground. To do this, add the JSON that you copied from the Meta Playground.

Do the following:

1. (Optional) To format the JSON, which you copied from the Meta Playground, use a tool such as Postman. In Postman, copy the JSON and select Beautify.

2. Paste the JSON into the WhatsApp Flow in your WhatsApp Manager.

   

3. Select Save.

   On the right-hand side, you can see the preview of the WhatsApp Flow.

   

4. To see the WhatsApp Flow in interactive mode, go to Settings > Enable Interactive mode.

   

5. (Optional) Include complex components (opens in a new tab) that are not available in Meta Playground. To use them, update the JSON in your WhatsApp Manager.

6. Finish designing the WhatsApp Flow.

Test and publish the WhatsApp Flow

1. To test the WhatsApp Flow, add it to your chatbot and send it. Make sure that you select the Flow status as Draft.

2. To publish the flow, select Publish.

   Note

   You cannot edit the WhatsApp Flow after you publish it.

Send the WhatsApp Flow through Answers

To incorporate WhatsApp Flows into your Answers chatbot, use the WhatsApp Flows element. In this element, you can add a welcome message and a button that they can select to enter the flow.

In the element, configure the following information. You can get this information from the WhatsApp Flow that you created in your WhatsApp Manager.

• Flow ID: Unique ID of the WhatsApp Flow.
• Flow status: Depending on the status of the WhatsApp Flow in WhatsApp Manager, set to either Draft or Published.
• Flow action: Select Navigate for static WhatsApp Flows or Data exchange for dynamic WhatsApp Flows.
• ID of first screen: If the Flow action is Navigate, specify the screen ID that you created for the first screen of the WhatsApp Flow.
• Flow token: Create an identifier for the WhatsApp Flow.

Implementation over API

Complete the steps in each of the following sections sequentially.

Create a WhatsApp Flow in Meta Playground

1. Go to Meta playground (opens in a new tab) and create a WhatsApp Flow based on your use case.
2. To add new screens to the WhatsApp Flow, select Add new.
3. To add new components, select Add content.
4. Configure the components based on your use case.
5. After you finish designing the WhatsApp Flow, JSON is automatically created and is ready to use. Select Copy Flow JSON.

Create and configure the WhatsApp Flow in the API

1. In the WhatsApp API (opens in a new tab), create an outline of the WhatsApp Flow.

   The WhatsApp Flow is created in Draft status. You will receive a WhatsApp Flow ID.

   

2. Update the WhatsApp Flow so that it contains the components and elements that you created in the Meta Playground. To do this, add the JSON that you copied from the Meta Playground. Include the WhatsApp Flow ID.

   

3. (Optional) Include complex components (opens in a new tab) that are not available in Meta Playground.

4. Finish designing the WhatsApp Flow.

Test and publish the WhatsApp Flow

1. To test the WhatsApp Flow, send it over the API. Make sure that you select the flowStatus as Draft.

2. Publish (opens in a new tab) the WhatsApp Flow.

   Note

   You cannot edit the WhatsApp Flow after you publish it.

   

Send the WhatsApp Flow over API

1. In the API to send WhatsApp Flows (opens in a new tab), update the recipients (to) and sender (from).

2. Set the mode to either Draft or Published.

3. Configure the following information. You can get this information from the WhatsApp Flow that you created.

   • flowId: Unique ID of the WhatsApp Flow.
   • flowStatus: Depending on the status of the WhatsApp Flow in WhatsApp Manager, set to either Draft or Published.
   • flowAction: Specify Navigate for static WhatsApp Flows or Data_Exchange for dynamic WhatsApp Flows.
   • screen: If flowAction is Navigate, specify the screen ID that you created for the first screen of the WhatsApp Flow.
   • flowToken: Create an identifier for the WhatsApp Flow.