What is WhatsApp Flows?

Index:

What it is used for

WhatsApp Flows is a way to build structured interactions for business messages. With Flows, companies can define, configure, and customize messages with rich interactions that give customers more structure in how they communicate.

You can use Flows for use cases such as scheduling, product display, collecting customer feedback, capturing sales leads, or any other use case where structured communication is more natural or comfortable for your customers.

Consulting Meta’s official documentation

Meta provides comprehensive documentation covering all aspects to understand and create Flows, with practical code examples and how to build interfaces and components. Use this reference to build and test your interfaces, and when ready, you can use Blip’s APIs to create and integrate into your intelligent contact.

Complete Meta documentation here.

What will you learn in this Blip Help article?

Here we will show the basics to create and send a basic Flow in your bot, which you can improve to meet your needs.

You will learn:

How to get credentials for your bot’s command API in Blip.
How to create a Flow, which will be created directly in your WABA.
How to update the Flow by providing the Flow JSON code responsible for assembling the components and navigation behavior of your Flow. (Similar to HTML used to build components for web browsers, the Flow JSON builds components to be displayed inside WhatsApp.)
How to update the public key of a Flow, so communication between your server and WhatsApp is encrypted and secure.
How to delete or discontinue a Flow.
How to use the Blip Builder to send your Flow to your contacts.

How to create flows via Blip commands APIs

Getting credentials to access the API

To use Blip’s command API, you need to obtain credentials in your chatbot’s settings. With this information, you can use any HTTP call tool to manage your Flows. The following examples use Postman, but can be reproduced in any similar tool.

Go to the connection information menu to get:

Authorization
URL to send commands

Environment setup:

In Postman, configure the variables according to your Bot data obtained in the API credentials session.

Overview

All Flows are created in the WhatsApp Business Account (WABA) of the WhatsApp number. Every Flow is created with the status Draft, meaning it is still under development and must be configured and published before being widely used.

After creating a Flow by providing the Name and Category, you must send the Flow JSON file, which is a format Meta created to represent the organization of visual components within each Flow screen.

After updating the Flow with the Flow JSON code, you can test how it looks using the Blip Builder, and when everything is correct with your Flow, you can publish it within the WABA.

Once published, the Flow cannot be modified, only discontinued/deactivated.
Flows can only be edited in Draft status; if published, they can no longer be edited.
A Flow that has never been published can be deleted from the WABA.

How to create a Flow

REQUEST:

Besides the basic parameters of Blip’s command API such as [id], [to], [type] which must be the same in all requests to manage Flows, provide:

method: set
uri: /whatsapp-flows
name: The name of your Flow
categories: [At least one category is required]
1. Possible values for categories: SIGN_UP, SIGN_IN, APPOINTMENT_BOOKING, LEAD_GENERATION, CONTACT_US, CUSTOMER_SUPPORT, SURVEY, OTHER

RESPONSE:

In the response, you will receive the ID of the created Flow. This ID is important for all subsequent calls. When creating the flow, save this ID.

This flow will be created in the WABA linked to the bot. With this ID, you can use other endpoints to manage this flow.

This ID will also be used later in the Blip Builder to send the flow to your contacts.

Listing your created Flows

REQUEST:

method: get
uri: /whatsapp-flows

RESPONSE:

In the response, besides the name and categories, you can check:

The status, which will initially be DRAFT until you publish the Flow.
Any validation errors, if present.

These validation errors will only appear after sending the Flow JSON code, and if this code has any semantic/syntax problems.

Sending the Flow JSON code that represents your Flow’s visual

Meta created a new format and language for WhatsApp that you need to create to represent the graphical interface of your Flow. Similar to HTML markup code, it marks which components and structure each Flow screen will contain.

To learn more about this format and its application, consult Meta’s official documentation on the developer portal. It is important to write the code in the correct format, always paying attention to validation errors.

Meta provides the Playground, a visual builder to assist in the ideation and development of your Flows. From the Playground, you can build your Flows with a few clicks and obtain the JSON. Using the builder is not a requirement to create your JSON code but is a helpful tool.

With the JSON, you should update your created Flow with this code by inserting the code in the following request:

REQUEST:

method: set
uri: /whatsapp-flows/flow-json/{FLOW_ID}

The code below sends the JSON to create a ‘hello world’ Flow:

The above Flow JSON code will generate a Flow with the following layout:

RESPONSE:

Getting the preview link and more details of your Flow

To preview your Flow, you can use an endpoint to get the preview link. The response also brings more information related to the WABA where the Flow was created.

REQUEST:

method: get
uri: /whatsapp-flows/{FLOW_ID}

RESPONSE:

In the response, you can get a link to access the preview, remembering that this link expires in approximately 30 days. This preview is shown in the browser, displaying an experience close to how it will appear on the user’s smartphone.

Updating the name and category of your Flow

Before being published, you can edit all information of your Flow, such as Name, categories, and even the Flow JSON code.

REQUEST:

method: set
uri: /whatsapp-flows/{FLOW_ID}

RESPONSE:

To get the JSON of your current Flow

REQUEST:

method: get
uri: /whatsapp-flows/assets/{FLOW_ID}

RESPONSE:

By accessing the highlighted link, you get the current JSON file of your Flow:

To publish your Flow for production use

Every Flow is created in DRAFT status, meaning it is a draft; while in draft, you can edit this Flow without problems.

For production use, it is necessary to publish. Once published, the Flow undergoes Meta’s approvals (this process is automatic and instant) and from then on cannot be edited.

Attention!

If you need to remove a Flow in DRAFT status, you can delete it; we will cover this topic later in this article.

If you need to remove a Flow in PUBLISHED status, you must mark it as DEPRECATED, which we will also show below.

To publish a Flow:

REQUEST:

method: get
uri: /whatsapp-flows/publish/{FLOW_ID}

RESPONSE:

Deactivating a published Flow

If you have a published Flow and want to deactivate it so it can no longer be used, use the following request:

REQUEST:

method: get
uri: /whatsapp-flows/deprecate/{FLOW_ID}

RESPONSE:

Deleting a Flow that has not been published yet

Before being published, a Flow can be completely deleted from your WABA. To do this, use the following request:

To do this:

REQUEST:

method: delete
uri: /whatsapp-flows/{FLOW_ID}

RESPONSE:

Flows with endpoints (data channel)

A Flow can have two behaviors:

Internal Flow: All data collected flows only between the screens of the Flow itself. For example, if you request the user’s name on the first screen, this information can be passed to the second screen and, at the end of the input, the data will be available to your bot.
Flow with External API (Data Channel): In this mode, the Flow communicates with a dedicated intermediary API. This allows, for example, capturing data typed by the user, processing it on your server, and returning a dynamic response to the Flow. A common use case is a login, where the user enters credentials, the server validates them, and returns the result to display on the next screen.

To implement the second option, you will need to:

Configure the Flow JSON considering the use of an endpoint (see Meta documentation).
Implement an encryption certificate to ensure the security of data exchanged between WhatsApp and your API. Through Blip’s API, just provide the corresponding public key.
Important: the public key is valid for only one number and must be reconfigured whenever the Flow with endpoint is used on a new number or router.

For this, use the request:

REQUEST:

method: set
uri: /whatsapp-flows/public-key/upload

Note: The public key in the example is invalid and should not be used. Replace it with the key generated by you according to the indicated documentation.

RESPONSE

How to display your Flows using dynamic content in the Builder

Creating a block and using the Flow send message.

To send your Flow to the user during a conversation, you must use a block with Dynamic Content in the Builder.

In the dynamic content, you can specify the type of message you want to send with the following example code:

Parameters you need to modify:

flow_id: the ID of the flow you want to send
inside [flow_action_payload], the parameter screen, being the first screen defined in your Flow JSON file

{
  "recipient_type": "individual",
  "messaging_product": "whatsapp",
  "type": "interactive",
  "interactive": {
    "type": "flow",
    "header": {
      "type": "text",
      "text": "Title of buttom CTA"
    },
    "body": {
      "text": "Body of buttom CTA"
    },
    "footer": {
      "text": "Footer of buttom CTA"
    },
    "action": {
      "name": "flow",
      "parameters": {
        "flow_message_version": "3",
        "flow_token": "any_string_for_this_example",
        "flow_id": "10323711744212514",
        "flow_cta": "Open Flow",
        "flow_action": "navigate",
        "flow_action_payload": {
          "screen": "WELCOME_SCREEN",
          "data": {
            "type": "dynamic_object"
          }
        }
      }
    }
  }
}

Final considerations

WhatsApp Flows is a continuously evolving feature. Our goal is to continuously improve the experience of creating and managing Flows in Blip; therefore, follow the news in our community. Additionally, we currently have extensions in the Blip Store developed by our partners, designed to speed up and simplify the process of creating your Flows.

Need more help? Explore our content at Blip Academy or Blip Community, watch tutorials on our YouTube channel or ask your questions in our support channel 😃