Skip to contentSkip to navigationSkip to topbar
On this page

Using Buttons In WhatsApp



What are WhatsApp buttons?

what-are-whatsapp-buttons page anchor

WhatsApp lets you add buttons to message templates. There are two types of buttons: Quick replies and Call to action buttons. These buttons open up many opportunities for businesses worldwide to engage with their customers on WhatsApp, one of the most popular messaging applications.

Quick replies let businesses define buttons that users can tap to respond. When a Quick reply is tapped, a message containing the button text is sent in the conversation.

Call to action buttons trigger a phone call or open a website when tapped. Please note that at this time, WhatsApp does not support deep links.

To use buttons, you need to submit them as part of a message template to WhatsApp. Once approved, templates containing buttons can be sent by sending the message text in your API request.


Creating templates with buttons

creating-templates-with-buttons page anchor

To use buttons, you need to submit a template that contains the buttons. Go to the Twilio console, navigate to Messaging > Content Template Builder, and click the Create new button. Here, you need to submit a message template containing buttons.

The content types that can contain buttons are:

  • Call to action
  • Quick reply
  • Card
  • Carousel
  • WhatsApp Card

The following buttons are available:

  • Quick reply
  • URL
  • Phone Call
  • WhatsApp Voip call
  • Copy Coupon Code All buttons can be used in session without approval except copy coupon code. Coupons always need approval.

For more information, please see Sending Notifications with Templates and Content Types Overview(link takes you to an external page).

whatsapp-button-template.

Sending templates with buttons

sending-templates-with-buttons page anchor

Once your template with buttons has been approved, you can send buttons as part of your WhatsApp messages. To send a button, send the template like any other Content Template. To see how to send Content Templates, see Send Templates Created with Content Template Builder(link takes you to an external page).

whatsapp-callaction-buttons.
quick-reply-button.
Call to action buttonsQuick reply button
(information)

Info

Quick reply buttons can be sent without approval within a 24 hour session(link takes you to an external page). To send quick reply buttons, create the template but do not submit it for approval. You can then send the quick reply template directly without approval in a 24 hour session.

Sending Content TemplatesLink to code sample: Sending Content Templates
1
// Download the helper library from https://www.twilio.com/docs/node/install
2
const twilio = require("twilio"); // Or, for ESM: import twilio from "twilio";
3
4
// Find your Account SID and Auth Token at twilio.com/console
5
// and set the environment variables. See http://twil.io/secure
6
const accountSid = process.env.TWILIO_ACCOUNT_SID;
7
const authToken = process.env.TWILIO_AUTH_TOKEN;
8
const client = twilio(accountSid, authToken);
9
10
async function createMessage() {
11
const message = await client.messages.create({
12
contentSid: "HXXXXXXXXX",
13
contentVariables: JSON.stringify({ 1: "Name" }),
14
from: "whatsapp:+15551234567",
15
messagingServiceSid: "MGXXXXXXXX",
16
to: "whatsapp:+18551234567",
17
});
18
19
console.log(message.body);
20
}
21
22
createMessage();

Output

1
{
2
"account_sid": "ACXXXXXXXXX",
3
"api_version": "2010-04-01",
4
"body": "Hello! 👍",
5
"date_created": "Thu, 24 Aug 2023 05:01:45 +0000",
6
"date_sent": "Thu, 24 Aug 2023 05:01:45 +0000",
7
"date_updated": "Thu, 24 Aug 2023 05:01:45 +0000",
8
"direction": "outbound-api",
9
"error_code": null,
10
"error_message": null,
11
"from": "whatsapp:+15551234567",
12
"num_media": "0",
13
"num_segments": "1",
14
"price": null,
15
"price_unit": null,
16
"messaging_service_sid": "MGXXXXXXXX",
17
"sid": "SMaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
18
"status": "queued",
19
"subresource_uris": {
20
"media": "/2010-04-01/Accounts/ACaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa/Messages/SMaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa/Media.json"
21
},
22
"tags": {
23
"campaign_name": "Spring Sale 2022",
24
"message_type": "cart_abandoned"
25
},
26
"to": "whatsapp:+18551234567",
27
"uri": "/2010-04-01/Accounts/ACaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa/Messages/SMaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa.json"
28
}

When end-users tap on one of your Quick replies, this automatically triggers a message that is sent to your business with the button text. If you have a webhook configured for incoming messages to the WhatsApp sender that the Quick reply was sent to, then you can get the text of the button tapped in the ButtonText parameter from the callback. Additionally you can set and get the a unique identifier for each quick reply button using the id field. For more information, please see Twilio's Webhook Requests.


  • Message templates with buttons incur standard template charges(link takes you to an external page) wherever applicable.
  • Buttons are supported in Twilio Studio, Flex and Conversations API by sending a message with a text body that matches the corresponding template with buttons.

Need some help?

Terms of service

Copyright © 2024 Twilio Inc.