Buttons

Create and send templates with URL, quick reply, and contact request buttons

Create

Create template - TypeScript SDK

import { WhatsAppClient } from '@kapso/whatsapp-cloud-api';

const client = new WhatsAppClient({
  baseUrl: 'https://api.kapso.ai/meta/whatsapp',
  kapsoApiKey: process.env.KAPSO_API_KEY!
});

await client.templates.create({
  businessAccountId: '123456789',
  name: 'customer_feedback',
  category: 'UTILITY',
  language: 'en_US',
  parameterFormat: 'NAMED',
  components: [
    {
      type: 'BODY',
      text: 'Hi {{customer_name}}, how was your experience with us?',
      example: {
        body_text_named_params: [
          { param_name: 'customer_name', example: 'Sarah' }
        ]
      }
    },
    {
      type: 'BUTTONS',
      buttons: [
        {
          type: 'QUICK_REPLY',
          text: 'Great!'
        },
        {
          type: 'QUICK_REPLY',
          text: 'Not good'
        }
      ]
    }
  ]
});

Request contact info

Use REQUEST_CONTACT_INFO when you want a template to ask the user for their phone number.

The button text is fixed to Share Contact Info.

Create template - REST API

curl -X POST 'https://api.kapso.ai/meta/whatsapp/v24.0/123456789/message_templates' \
  -H 'X-API-Key: YOUR_API_KEY' \
  -H 'Content-Type: application/json' \
  -d '{
    "name": "request_phone_number",
    "category": "UTILITY",
    "language": "en_US",
    "components": [
      {
        "type": "BODY",
        "text": "Please share your phone number so we can finish your request."
      },
      {
        "type": "BUTTONS",
        "buttons": [
          {
            "type": "REQUEST_CONTACT_INFO"
          }
        ]
      }
    ]
  }'

When sending the approved template, do not include a button component for REQUEST_CONTACT_INFO.

Send template - REST API

curl -X POST 'https://api.kapso.ai/meta/whatsapp/v24.0/647015955153740/messages' \
  -H 'X-API-Key: YOUR_API_KEY' \
  -H 'Content-Type: application/json' \
  -d '{
    "messaging_product": "whatsapp",
    "recipient": "US.13491208655302741918",
    "type": "template",
    "template": {
      "name": "request_phone_number",
      "language": {
        "code": "en_US"
      }
    }
  }'

When the user taps the button, you receive a contacts message with origin: "contact_request".

Send

Send template - TypeScript SDK

import { WhatsAppClient } from '@kapso/whatsapp-cloud-api';

const client = new WhatsAppClient({
  baseUrl: 'https://api.kapso.ai/meta/whatsapp',
  kapsoApiKey: process.env.KAPSO_API_KEY!
});

await client.messages.sendTemplate({
  phoneNumberId: '647015955153740',
  to: '15551234567',
  template: {
    name: 'customer_feedback',
    language: { code: 'en_US' },
    components: [
      {
        type: 'body',
        parameters: [
          { type: 'text', parameterName: 'customer_name', text: 'Sarah' }
        ]
      },
      {
        type: 'button',
        sub_type: 'quick_reply',
        index: '0',
        parameters: [
          { type: 'payload', payload: 'positive_feedback' }
        ]
      },
      {
        type: 'button',
        sub_type: 'quick_reply',
        index: '1',
        parameters: [
          { type: 'payload', payload: 'negative_feedback' }
        ]
      }
    ]
  }
});

Static buttons

PHONE_NUMBER and REQUEST_CONTACT_INFO buttons are fully defined by the approved template. Do not send a button component for them.

Every other button type takes send-time values and needs its own component: quick_reply payloads, url suffixes, copy_code coupon codes, flow tokens and action data (see Flow templates), and otp codes (see Authentication templates).

The index of each button component still refers to the button’s position in the template’s BUTTONS component, so a static button occupying position 0 does not shift the indexes of the buttons after it.