Pular para o conteúdo
ToolHubCalculadoras e ferramentas grátis

Botão flutuante do WhatsApp para site

Para colocar o botão do WhatsApp no site, digite o número e a mensagem, escolha o texto e o canto da tela e copie o código pronto. Cole no rodapé do site (no WordPress, num bloco HTML personalizado). O botão fica fixo no canto, verde, e abre a conversa com a mensagem já escrita. O código é leve: não usa plugin nem JavaScript.

Passo a passo

  1. Digite o número do WhatsApp com DDD e a mensagem.
  2. Abra “Botão flutuante para o seu site”, escolha o texto e o canto.
  3. Toque em “Copiar o código”.
  4. Cole no site: no WordPress, em Aparência → Widgets ou no Editor do site, num bloco “HTML personalizado” do rodapé.

Por que um botão sem plugin

Plugins de WhatsApp costumam carregar scripts, fontes e imagens que deixam o site mais lento e atrapalham a nota do Google (Core Web Vitals). Este botão é só um link com estilo: pesa menos de 1 KB e não roda nada no navegador do visitante.

Saber quantas pessoas clicaram

Use uma mensagem própria para o site, como “Vim pelo site”. Cada conversa que chegar com essa frase veio do botão. Se o site tem Google Analytics, os cliques em links externos aparecem nos eventos de saída.

Como funciona o link do WhatsApp

O link usa o endereço oficial do WhatsApp, wa.me, seguido do número com o código do país (55 no Brasil) e o DDD, sem espaços nem traços. A mensagem vai depois de ?text=, com os espaços e acentos convertidos para funcionar em qualquer celular. Exemplo:

https://wa.me/5511999999999?text=Ol%C3%A1%21

Quem toca no link abre a conversa direto com você, sem precisar salvar o número na agenda. O link não expira e não passa por nenhum site intermediário. Nada do que você digita aqui é enviado ao nosso servidor.

Outros usos do link do WhatsApp

Volte para o gerador de link para WhatsApp completo ou veja outro caso:

Perguntas frequentes

Funciona em qualquer site?

Sim: WordPress, Wix, sites em HTML, lojas virtuais e blogs. Basta aceitar um trecho de HTML.

O botão atrapalha o AdSense ou o aviso de cookies?

Ele fica num canto e é pequeno. Se cobrir algo no celular, escolha o outro canto ou diminua o texto (pode deixar só o ícone, apagando o texto).

Posso trocar a cor?

Pode. No código, troque #25D366 (verde do WhatsApp) pela cor que quiser.

Outras ferramentas

Mais de Dia a dia Ver todas as 21 ferramentas

Instalar ToolHub

Tenha as ferramentas na tela inicial, como um aplicativo. Não ocupa espaço e não pede cadastro.

  1. Toque no botão Compartilhar ⬆︎ na barra do Safari.
  2. Role e toque em Adicionar à Tela de Início.
  3. Toque em Adicionar. Pronto!
  1. Abra o menu do navegador ⋮.
  2. Toque em Instalar app ou Adicionar à tela inicial.
  3. Confirme. O ícone aparece junto com seus outros apps.