Ir para o conteúdo principal
Móvel

Integrar Whatsapp Clique para conversar no WordPress

por 27 de julho de 2020#!31Sexo, 07 de agosto de 2020 17:24:57 +0200+02:005731#31Sexo, 07 de agosto de 2020 17:24:57 +0200+02:00-5Europa/Roma3131Europa/Roma202031 19h31-31Sexo, 07 de agosto de 2020 17:24:57 +0200+02:005Europa/Roma3131Europa/Roma2020312020Sexo, 07 de agosto de 2020 17:24:57 +0200245248pmSexta-feira=3831#!31Sexo, 07 de agosto de 2020 17:24:57 +0200+02:00Europa/Roma8#7 de agosto de 2020#!31Sexo, 07 de agosto de 2020 17:24:57 +0200+02:005731#/31Sexo, 07 de agosto de 2020 17:24:57 +0200+02:00-5Europa/Roma3131Europa/Roma202031#!31Sexo, 07 de agosto de 2020 17:24:57 +0200+02:00Europa/Roma8#Sem comentarios

1. Encontre um ícone do Whatsapp

Primeiro, precisamos de um ícone para o usuário clicar. Existem muitos sites de imagens livres de royalties para escolher. Baixe um ícone de sua preferência, carregue-o na seção de mídia e adicione o URL ao lado, por enquanto.

2. Defina os parâmetros

Existem 2 parâmetros que você precisa decidir:

  1. O número de telefone para o qual você deseja enviar a mensagem whatsapp
  2. A mensagem que será enviada a você

3. Junte tudo

Aqui está o seu botão:

< A href = "Https://api.whatsapp.com/send?phone=00155555555&text=I Estou interessado em seu serviço" alvo = "_Em branco" classe = "Whatsapp" >
< img src = "Https://site.com/wp-content/uploads/2018/07/whatsapp.png" alt = "Whatsapp" >
< / para >

Copie o texto acima, mas certifique-se de alterar o número de telefone e a mensagem.

4. Cole o código

Para fins deste tutorial, colocaremos o ícone no canto inferior esquerdo da tela e daremos a ele uma posição fixa para que você não o perca.

Então, para fazer isso, vou colar o código acima no meu footer.phparquivo antes do corpotag de fechamento.

Depois de salvar meu arquivo e atualizar o navegador, poderei ver o ícone na parte inferior da página. Agora vamos estilizá-lo.

5. Desenhe o botão Whatsapp

Tudo o que você precisa fazer é escrever algumas linhas CSSe cole no seu style.cssArquivo.

.Whatsapp {
posição: fixa;
esquerda: 5px;
inferior: 65px;
}

Como você pode ver, posicionei meu ícone a 5 pixels da esquerda da tela e a 65 pixels da parte inferior. Fiz isso porque ele bloqueava parte do texto no rodapé quando eu rolava para o final da página, mas você pode mexer nele como quiser.

6. O momento da verdade

Agora, tudo o que você precisa fazer é atualizar a página, certificar-se de que gosta do local onde o ícone está posicionado, clicar nele e certificar-se de que você foi transferido para o WhatsApp para enviar sua mensagem.

Embora este tutorial seja incrivelmente fácil de fazer no seu site, se você ainda precisar de um plugin, aqui está um plugin que ajudará você a implementar um botão de clique para ligar do WhatsApp.

Clique em Bate-papo para bate-papo de WhatsApp

Clique em Bate-papo para bate-papo do WhatsApp

Este plugin possui 10 estilos de design diferentes e é muito fácil de usar. Aqui estão alguns outros recursos:

  • Escolha o seu ícone / imagem
  • animações
  • Estilo em uma página / postagem específica
  • Defina sua mensagem
  • Suporte para eventos do Google Analytics e do Gerenciador de tags
  • Suporte para eventos do Facebook

Deixe uma resposta