Como resolver o problema na Api do Whatsapp em navegadores Desktop

Neste post vou te ensinar a como resolver o problema do link da api do WhatsApp “Click to Chat” não funcionar nos navegadores desktop Firefox e Safari criando um link “responsivo” do WhatsApp.

O que é a api do WhatsApp?

Há um tempo o WhatsApp liberou uma função “Click to Chat” onde você pode criar links onde a pessoa pode iniciar uma conversa com o seu telefone sem que ela tenha o número de telefone salvo. Com esta função você pode até adicionar textos padrões para a pessoa enviar para você.

Qual o problema?

Existem ̶d̶u̶a̶s̶ três bases para você fazer essa solução: whatsapp://, api.whatsapp e web.whatsapp. Em toda a internet você vai encontrar as pessoas ensinando com o api., porém em alguns testes percebi que não funciona nos navegadores desktop Firefox e Safari (update 06/2019) e em iphones. ̶N̶e̶s̶t̶e̶s̶ ̶s̶ó̶ ̶f̶u̶n̶c̶i̶o̶n̶a̶m̶ ̶o̶ ̶w̶e̶b̶.̶w̶h̶a̶t̶s̶a̶p̶p̶ ̶e̶ ̶o̶ ̶w̶e̶b̶ ̶n̶ã̶o̶ ̶f̶u̶n̶c̶i̶o̶n̶a̶ ̶e̶m̶ ̶m̶o̶b̶i̶l̶e̶s̶.̶ Web.whatsapp funciona em desktops e whatsapp:// em mobiles com app.

Update 06/2019 — Uma feature futura será escolher entre aplicativo ou navegador, em vista que alguns usuários utilizam aplicativo no computador.

Como resolver?

Isto pode ser resolvido com um script simples que vai redirecionar o usuário de acordo com o dispositivo que ele está utilizando.

Update 01/2019 — Criei um gerador de link onde você pode subir no próprio servidor ou usar o meu exemplo. https://github.com/jeanlivino/whatsapp-link-generator

Update 05/2019 — Para usuários WordPress, criei um plugin que adiciona um post type para gerar links: https://github.com/jeanlivino/whatsapp-redirect-wordpress-plugin

Para isso você utilizará como base o código abaixo:

<?php
// Fix Api Whatsapp on Desktops
// Dev: Jean Livino
// insert the text and message
$phone = 'YOURNUMBER';
$message = 'YOURTEXT';
// DO NOT EDIT BELOW
$message = urlencode($message);
$message = str_replace('+','%20',$message);
$iphone = strpos($_SERVER['HTTP_USER_AGENT'],"iPhone");
$android = strpos($_SERVER['HTTP_USER_AGENT'],"Android");
$palmpre = strpos($_SERVER['HTTP_USER_AGENT'],"webOS");
$berry = strpos($_SERVER['HTTP_USER_AGENT'],"BlackBerry");
$ipod = strpos($_SERVER['HTTP_USER_AGENT'],"iPod");
// check if is a mobile
if ($iphone || $android || $palmpre || $ipod || $berry == true)
{
header('Location: whatsapp://send?phone='.$phone.'&text='.$message);
//OR
echo "<script>window.location='whatsapp://send?phone='.$phone.'&text='.$message</script>";
}
// all others
else {
header('Location: https://web.whatsapp.com/send?phone='.$phone.'&text='.$message);
//OR
echo "<script>window.location='https://web.whatsapp.com/send?phone='.$phone.'&text='.$message</script>";
}
?>

Link do GitHub

1. Altere onde estiver “YOURNUMBER” pelo seu número no seguinte formato 558590000000, sem o “+” e “()”.
2. Substitua o texto “YOURTEXT” pelo o que você deseja que a pessoa envie. Ex. “Eu Quero”
3. Salve o arquivo com nome index.php e suba no seu servidor.

Conclusão

A solução “Click to Chat” é incrível, mas para suas ações é preciso ter atenção nesta api, se não, você vai acabar perdendo muitos leads que usam o Safari e Firefox.

Esse é o meu primeiro post no Medium. Você achou esse post relevante? Se sim, dá um Clap e um Follow para ajudar :D