Como criar ligação para o WhatsApp para usar no site

Já viste vários sites que têm ligações diretas para o WhatsApp e gostavas de saber como criar? Neste artigo vou mostrar-te como podes criar uma ligação simples, ou então personalizar com uma mensagem pré-preenchida, sem precisares de instalar nenhum plugin nem usar site de terceiros.

O segundo caso é muito útil se tiveres vários serviços em que encaminhas o possível cliente para o WhatsApp. Usares esta funcionalidade pode ajudar-te a poupar tempo!

Criar ligação de WhatsApp simples

O que esta ligação faz é apenas enviar para a conversa de WhatsApp.

1. Identificar indicativo do número de telemóvel

Primeiro deves identificar o indicativo do número de telemóvel. Considerando que será um número português, o indicativo é +351. No entanto, para efeito de criação desta ligação o “+” não é considerado. Assim o número ficaria 351912345678, por exemplo.

2. Substituir o número na ligação personalizada

A seguir, só tens de substituir o número nesta ligação https://wa.me/<number> em que <number> é substituído pelo número obtido no primeiro passo. Ficando assim: https://wa.me/351912345678 .

Criar ligação de WhatsApp com mensagem pré-preenchida

Neste caso, consegues criar uma mensagem personalizada que aparece automaticamente no campo de mensagem dentro do WhatsApp.

Ecrã que se vê quando se clica numa ligação do whatsapp com mensagem personalizada.

O modelo de ligação é este https://wa.me/whatsappphonenumber/?text=urlencodedtext em que whatsappphonenumber é o número com o indicativo e o urlencodedtext é o texto da mensagem personalizada.

Exemplo de como ficaria: https://wa.me/351912345678?text=mensagem%20personalizada

No texto codificado em URL, o espaço corresponde a %20. Assim, cada espaço deve ser substituído por essa expressão. Podes fazê-lo manualmente, ou então usar a funcionalidade de localizar e substituir de um processador de texto, como o Word ou o Google Docs.

Exemplo Google Docs: Abre um documento e vai a Editar > Localizar e substituir (ou usa o atalho Ctrl + Shift + H). Em “Localizar” faz um espaço, e em “Substituir por” escreve %20, conforme vês na imagem abaixo.

Caixa de pesquisa no Google Docs com o campo para “substituir por”.

Por curiosidade, experimentar usar o link com os espaços sem substituir por %20 e funcionou… No entanto, a documentação do WhatsApp aconselha a que seja usado o texto codificado em URL.

Em que situações é que pode ser útil a ligação com mensagem pré-preenchida?

Se tens vários serviços ou pacotes diferentes do mesmo serviço, e a primeira fase do processo é conversarem contigo via WhatsApp, podes incluir o nome do serviço ou pacote na mensagem pré-preenchida, para saberes à partida a que serviço é que o potencial cliente se refere.

Exemplo: Site de maquilhadora que faz maquilhagens para casamentos

Dentro da maquilhagem de casamento, a maquilhadora tem o pacote de maquilhagem apenas da noiva, o pacote de maquilhagem de noiva + mãe da noiva, e ainda o pacote de maquilhagem de ambos os noivos e respetivas mães. Assim pode criar três mensagens diferentes, como:

  • Maquilhagem da Noiva – “Olá, estou interessada no serviço de maquilhagem de casamento”: https://wa.me/351912345678/?text=Olá,%20estou%20interessada%20no%20serviço%20de%20maquilhagem%20de%20casamento
  • Maquilhagem da Noiva + mãe – “Olá, estou interessada no serviço de maquilhagem de casamento, com maquilhagem da minha mãe incluída”: https://wa.me/351912345678/?text=Olá,%20estou%20interessada%20no%20serviço%20de%20maquilhagem%20de%20casamento,%20com%20a%20maquilhagem%20da%20minha%20mãe%20incluída
  • Maquilhagem dos Noivos + mães – “Olá, estou interessada no serviço de maquilhagem de casamento para ambos os noivos e as nossas mães”: https://wa.me/351912345678/?text=Olá,%20estou%20interessada%20no%20serviço%20de%20maquilhagem%20de%20casamento%20para%20ambos%20os%20noivos%20e%20as%20nossas%20mães

E voilá, já tens a ligação do WhatsApp pronta para adicionar numa expressão (ex.: Envia-me mensagem), num botão ou num ícone do WhatsApp.

Vê neste artigo como podes ter um site com um design coerente.

Agora conta-me, como é que vais implementar isto no teu site? Comenta aí em baixo.

Junta-te à conversa

Deixa o teu comentário