![Quatro tipos de mensagem interativa criados pela API: opções, formulários, cartões e artigos, com compatibilidade variável entre canais.](/rails/active_storage/blobs/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBbFFSIiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--b98b2e94eaec454941ef0543ec170e1b67272c25/1729185331-como-criar-mensagens-interativas.png)

As mensagens interativas permitem enviar conteúdos que o cliente seleciona ou responde diretamente, como listas de **opções**, **formulários**, **cartões** e **artigos**. O widget do site oferece o conjunto mais completo; outros canais renderizam apenas os formatos que seus provedores suportam.

Esses tipos de mensagem são criados de forma programática, usando a **API de mensagens** (New Message API) da plataforma.

### Antes de começar

- Os exemplos completos abaixo são voltados ao **widget de chat do site**. Mensagens de opções (`input_select`) também são adaptadas em canais como Facebook, Telegram, LINE e WhatsApp Cloud; teste o formato no canal de destino.
- Você precisa de um **token de acesso à API** e do endpoint de criação de mensagens de uma conversa.
- O campo `content_type` define o tipo da mensagem e o campo `content_attributes` carrega os dados exibidos ao cliente. Mantenha esses nomes exatamente como mostrado nos exemplos.

## Exemplos de payload

Use os exemplos abaixo como corpo da requisição para criar cada tipo de mensagem interativa.

### 1. Opções

Exibe uma lista de itens para o cliente escolher.

```
{
    "content": "Selecione um dos itens abaixo",
    "content_type": "input_select",
    "content_attributes": {
        "items": [
            { "title": "Opção1", "value": "Opção 1" },
            { "title": "Opção2", "value": "Opção 2" }
        ]
    },
    "private": false
}
```

### 2. Formulário

Solicita um conjunto de campos ao cliente (texto, e-mail, seleção etc.).

```
{
  "content": "formulário",
  "content_type": "form",
  "content_attributes": {
    "items": [
      {
        "name": "email",
        "placeholder": "Por favor, insira seu email",
        "type": "email",
        "label": "Email",
        "default": "xyc@xyc.com"
      },
      {
        "name": "text_area",
        "placeholder": "Por favor, insira o texto",
        "type": "text_area",
        "label": "Texto Longo",
        "default": "Texto de exemplo"
      },
      {
        "name": "text",
        "placeholder": "Por favor, insira o texto",
        "type": "text",
        "label": "Texto",
        "default": "Entrada de exemplo"
      },
      {
        "name": "select",
        "label": "Selecionar Opção",
        "type": "select",
        "options": [
          {
            "label": "🌯 Burrito",
            "value": "Burrito"
          },
          {
            "label": "🍝 Macarrão",
            "value": "Macarrão"
          }
        ]
      }
    ]
  },
  "private": false
}
```

### 3. Cartões

Apresenta um card com imagem, título, descrição e botões de ação (links ou postbacks).

```
{
   "content": "mensagem de cartão",
   "content_type": "cards",
   "content_attributes": {
      "items": [
         {
            "media_url": "https://cdn.exemplo.com/produtos/camiseta-branca.jpg",
            "title": "Tênis Nike 2.0",
            "description": "Correndo com o Tênis Nike 2.0",
            "actions": [
               {
                  "type": "link",
                  "text": "Ver Mais",
                  "uri": "https://exemplo.com/produtos/camiseta-branca"
               },
               {
                  "type": "postback",
                  "text": "Adicionar ao carrinho",
                  "payload": "ITEM_SELECIONADO"
               }
            ]
         }
      ]
   },
   "private": false
}
```

### 4. Artigos

Compartilha uma lista de artigos com título, descrição e link.

```
{
    "content": "artigos",
    "content_type": "article",
    "content_attributes": {
        "items": [
            { "title": "Guia inicial da API", "description": "Um guia de início rápido para API", "link": "https://exemplo.com/guias/api" },
            { "title": "Documentos de desenvolvimento", "description": "Documentação e diretrizes de desenvolvimento", "link": "https://exemplo.com/docs" }
        ]
    },
    "private": false
}
```

Ajuste os títulos, valores e links dos exemplos conforme a necessidade do seu atendimento. O campo `private` deve permanecer como `false` para que a mensagem seja enviada ao cliente.