Conversational Components

Conversational Components are in-chat features that you can enable for each business phone number. They make it easier for WhatsApp users to interact with businesses.

You can configure easy-to-use commands, provide pre-written icebreakers that users can tap, and greet first time users with a welcome message.

This feature can be configured within the WhatsApp Business Manager or via API. See Configuration Steps.

Welcome Messages

Activating Welcome Messages allows your business to automatically greet users opening your chat for the first time. This can be particularly useful for enhancing service interactions like customer support or account management. For example, embedding a WhatsApp button on your app or website directs users to WhatsApp, where they're can be met with a welcome message that provides context on how they can interact with you.

If you enable this feature and a user messages you, Meta checks for an existing message thread between the user and your business phone number. If there is none, it triggers a messages webhook with type set to request_welcome. You can use this to then respond to the user with your own welcome message.

The request_welcome webhook triggers a customer service window which allows your business to send free-form messages when responding to customers.

Carousel template message as a Welcome Message

Webhook Payload

{
  "object": "whatsapp_business_account",
  "entry": [
    {
      "id": "<WHATSAPP_BUSINESS_ACCOUNT_ID>",
      "changes": [
        {
          "value": {
            "messaging_product": "whatsapp",
            "metadata": {
              "display_phone_number": "<BUSINESS_DISPLAY_PHONE_NUMBER>",
              "phone_number_id": "<BUSINESS_PHONE_NUMBER_ID>"
            },
            "contacts": [
              {
                "profile": {
                  "name": "<WHATSAPP_USER_NAME>"
                },
                "wa_id": "<WHATSAPP_USER_ID>"
              }
            ],
            "messages": [
              {
                "from": "<WHATSAPP_USER_PHONE_NUMBER>",
                "id": "<WHATSAPP_MESSAGE_ID>",
                "timestamp": "<TIMESTAMP>",
                "type": "request_welcome"  // Indicates first time message from WhatsApp user
              }
            ]
          },
          "field": "messages"
        }
      ]
    }
  ]
}

See Webhook Events and Notifications.

Ice Breakers

Ice Breakers are customizable, tappable text strings that appear in a message thread the first time you chat with a user. For example, "Plan a trip" or "Create a workout plan".

Ice Breakers are great for service interactions, such as customer support or account servicing. For example, you can embed a WhatsApp button on your app or website. When users tap the button, they will be redirected to WhatsApp where they can choose from a set of customizable prompts, showing them how to interact with your services.

You can configure up to 4 ice breakers on a business phone number from WhatsApp Manager. Each ice breaker can have a maximum of 80 characters. Emojis are not supported.

When a user taps an ice breaker, it triggers a standard received message webhook with the ice breaker string assigned to the body property in the payload. If the user attempts to message you instead of tapping an ice breaker, the keyboard will appear as an overlay, but it can be dismissed to see the ice breaker menu again.

If a WhatsApp user taps a universal link (i.e. wa.me link) configured with pre-filled text, the user interfaces for ice breakers are automatically dismissed.

Webhook Payload

{
  "object": "whatsapp_business_account",
  "entry": [
    {
      "id": "<WHATSAPP_BUSINESS_ACCOUNT_ID>",
      "changes": [
        {
          "value": {
            "messaging_product": "whatsapp",
            "metadata": {
              "display_phone_number": "<BUSINESS_DISPLAY_PHONE_NUMBER>",
              "phone_number_id": "<BUSINESS_PHONE_NUMBER_ID>"
            },
            "contacts": [
              {
                "profile": {
                  "name": "<WHATSAPP_USER_NAME>"
                },
                "wa_id": "<WHATSAPP_USER_ID>"
              }
            ],
            "messages": [
              {
                "from": "<WHATSAPP_USER_PHONE_NUMBER>",
                "id": "<WHATSAPP_MESSAGE_ID>",
                "timestamp": "<TIMESTAMP>",
                "text": {
                  "body": "Plan a trip" //ice breaker string
                },
                "type": "text"
              }
            ]
          },
          "field": "messages"
        }
      ]
    }
  ]
}

See Webhook Events and Notifications.

Commands

Commands are text strings that WhatsApp users can see by typing a forward slash in a message thread with your business.

Commands are composed of the command itself and a hint, which gives the user an idea of what can happen when they use the command. For example, you could define the command:

/imagine - Create images using a text prompt

When a WhatsApp user types, /imagine cars racing on Mars, it will trigger a standard received message webhook with that exact text string assigned to the body property. You could then generate and return an image of cars racing on the planet Mars from your software.

You can define up to 30 commands. Each command has a maximum of 32 characters, and each hint has a maximum of 256 characters. Emojis are not supported.

Webhook Payload:

{
  "object": "whatsapp_business_account",
  "entry": [
    {
      "id": "<WHATSAPP_BUSINESS_ACCOUNT_ID>",
      "changes": [
        {
          "value": {
            "messaging_product": "whatsapp",
            "metadata": {
              "display_phone_number": "<BUSINESS_DISPLAY_PHONE_NUMBER>",
              "phone_number_id": "<BUSINESS_PHONE_NUMBER_ID>"
            },
            "contacts": [
              {
                "profile": {
                  "name": "<WHATSAPP_USER_NAME>"
                },
                "wa_id": "<WHATSAPP_USER_ID>"
              }
            ],
            "messages": [
              {
                "from": "<WHATSAPP_USER_PHONE_NUMBER>",
                "id": "<WHATSAPP_MESSAGE_ID>",
                "timestamp": "<TIMESTAMP>",
                "text": {
                  "body": "/imagine cars racing on Mars"
                },
                "type": "text"
              }
            ]
          },
          "field": "messages"
        }
      ]
    }
  ]
}

See Webhook Events and Notifications.

Configuration Steps

via WhatsApp Business Manager

Businesses with shared WABAs can configure it in the WhatsApp Manager for any phone number as follows:

1. Navigate in the WhatsApp Manager within the Business Manager.

2. Go to Account Tools > Phone Numbers.

3. Click on Settings (gear icon:) next to the phone number you want to configure.
4. Find "Conversational Components" under Automations and toggle the "Welcome Messages" switch to turn the feature on.

If the WABA is under OBO (On Behalf Of), please contact our Support Team for assistance with this configuration.

via API

You can configure conversational components and view any configured values using the API.

The Conversational Components API has two endpoints:

POST /conversational_automation which is used to configure conversational components on a given phone number.

GET /conversational_automation which returns the current values for the enable_welcome_message, commands, and prompts fields on a given phone number.

Enable and Configure Conversational Components

POST https://waba-v2.360dialog.io/conversational_automation

Headers

Name	Value
Content-Type	application/json
Authorization	D360-APIKEY

Body

Name	Type	Value
enable_welcome_message Boleean	Optional. A boolean for enabling or disabling a welcome message on the phone number. See Welcome Messages.	true / false
command_list JSON	Optional. A list of commands to be configured. See Commands.	"commands": { "name": "generate" "description": "Create a new image", “name”: “rethink” “description”: “Generate new images from existing images”, }
prompt List of String	Optional. The prompt(s) to be configured. See Ice Breakers.	"prompts": ["Book a flight","plan a vacation"]

Sample Request

  curl -X POST \
 'https://waba-v2.360dialog.io/conversational_automation' \
 -H 'Authorization: D360-API-KEY' \
 -H 'Content-Type: application/json' \
 -d '{
   "enable_welcome_message": true/false,
   "commands": [
     {
       "command_name": "tickets",
       "command_description": "Book flight tickets",
     },
     {
       "command_name": "hotel",
       "command_description": "Book hotel",
     }
   ],
 "prompts": ["Book a flight","plan a vacation"]
}'

Response

200

{
  "success": true
}

400

{
  "error": "Invalid request"
}

Get Conversational Components

GEThttps://waba-v2.360dialog.io/conversational_automation

Headers

Name	Value
Content-Type	application/json
Authorization	D360-APIKEY

Response

200

{
  "conversational_automation": {
    "enable_welcome_message": true
    "prompts": [
      "Find the best hotels in the area",
      "Find deals on rental cars"
    ],
    "commands": [
      {
        "command_name": "tickets",
        "command_description": "Book flight tickets",
      },
      {
        "command_name": "hotel",
        "command_description": "Book hotel",
      }
    ],
  }
  "id": "123456"
}

400

{
  "error": "Invalid request"
}

Testing

To test conversational components once they have been configured, open the WhatsApp App and open a chat with your business phone number.

For welcome messages and ice breakers, if there is already a chat thread going with the business phone number, you must first delete the chat thread:

1. Open the thread in the WhatsApp client.

2. Tap the business phone number's profile

3. Tap Clear Chat > Clear All Messages.

4. Return to the (now empty) chat thread.

You can then send a message to the business phone number, which should trigger the request_welcome webhook.