> For the complete documentation index, see [llms.txt](https://help.cosmobots.io/help/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.cosmobots.io/help/bot-builder/canais/whatsapp1/adicionando-botoes-ao-canal-whatsapp.md).

# Adicionando botões ao canal whatsapp

Olá Cosmonauta, nesse artigo vou te explicar como adicionar botões ao whatsapp, os botões que são aceitos e como configurálos.

## **Botão de resposta**

Botões de Resposta são botões clicáveis que não possuem imagens e irão direcionar o usuário para uma determinada parte do bot. 

1-Para utilizá-los, na etapa de Mensagem, basta clicar no botão resposta rápida:

![](https://1728608858-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LSnqDgLbXBccdKMOdEJ%2F-MHC-9VieVtYzMtw_KZp%2F-MHC02gHablJXGAFjqot%2Fimage.png?alt=media\&token=658ee190-e7c3-4c1b-aa82-3a3500819028)

2- Definir o Título da Resposta rápida e Tipo(Se ela irá direcionar para um fluxo ou etapa:

![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/61002374775/original/Ix2v9ztvFcyVSq3Fd6_KwbdhwScUNOCyhw.gif?1591939939)

{% hint style="info" %}
OBS: O Texto da Mensagem que é enviada com respostas rápidas pode ter no máximo 60 caracteres.

OBS: Você pode configurar até 3 respostas rápidas de até 20 caracteres cada
{% endhint %}

Exemplo:

![](https://1728608858-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LSnqDgLbXBccdKMOdEJ%2F-MhbBGlDZNkxy8U2BVns%2F-MhbLy7Y-YtHuKWgK87J%2Fbot%C3%B5es%20de%20resposta.gif?alt=media\&token=0b6c58ba-e093-4ef5-a747-912aa0237ae3)

## **Lista**

A lista são opções no formato de Menu/Lista que levam o usuário à um fluxo/etapa do bot, 

1-Para utilizá-los, na etapa de Mensagem, basta clicar no botão resposta rápida:

![](https://1728608858-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LSnqDgLbXBccdKMOdEJ%2F-MHC-9VieVtYzMtw_KZp%2F-MHC02gHablJXGAFjqot%2Fimage.png?alt=media\&token=658ee190-e7c3-4c1b-aa82-3a3500819028)

2- Definir o Título da Resposta rápida e Tipo(Se ela irá direcionar para um fluxo ou etapa:

![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/61002374775/original/Ix2v9ztvFcyVSq3Fd6_KwbdhwScUNOCyhw.gif?1591939939)

{% hint style="info" %}

OBS: O Texto da Mensagem que é enviada  em Texto pode ter no máximo 60 caracteres.

OBS: Você pode configurar até 10 respostas de até 20 caracteres cada
{% endhint %}

Exemplo:

![](https://1728608858-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LSnqDgLbXBccdKMOdEJ%2F-MhbBGlDZNkxy8U2BVns%2F-MhbLgPm8v-ZZTkV7iRW%2Flista.gif?alt=media\&token=c0d6ee99-c6f4-49c8-9ecb-e5590bd795e3)

## **Cards**

Aqui você pode criar botões clicáveis com imagens. 

1- Para isso, dentro da [ etapa de mensagem](https://help.cosmobots.io/help/bot-builder/fluxo-da-conversa/mensagem), clique em cartões, e em seguida clique no botão + do cartão:

![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/61002374759/original/htBEKU48WsWaZcAzWjoRkghOzwa-1Pl0cg.gif?1591939837)

{% hint style="info" %}
OBS: No whatsapp você pode adicionar no máximo um Card por etapa de mensagem.
{% endhint %}

2- Preencha o Título, anexe ou coloque a url de  uma  imagem ou vídeo,  em Botão>Título, adicione as configurações do botão, em Tipo, defina se ele irá para uma etapa ou fluxo e salve:

![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/61002374770/original/-qrMtZ7uDQylJO04C0vTJTHGGQfQQmvCxA.gif?1591939876)

{% hint style="info" %}
OBS#: Um tamanho recomendado para que a imagem dos cards fiquem com uma boa resolução é de 700x300.

OBS#: O tamanho máximo de vídeos aceitos é de 16MB
{% endhint %}

Exemplo:

![](https://1728608858-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LSnqDgLbXBccdKMOdEJ%2F-MhbBGlDZNkxy8U2BVns%2F-MhbM3ItB8ft5qBtveWz%2Fcards.gif?alt=media\&token=f07e1b81-dc40-4561-8926-92fe4a7862c0)