Botão flutuante do WhatsApp para site
Coloque o número com DDD e a mensagem que o cliente já vai mandar. Ajuste a aparência, veja a prévia no canto da tela e copie o código.
Botão do WhatsApp no site
Tudo é feito no seu aparelho: nada é enviado para a internet.
Botão flutuante do WhatsApp para site: para que serve
Informe o WhatsApp com DDD e a mensagem que o cliente vai enviar. Escolha o canto da tela, o tamanho, a cor, a distância da borda, o balão de texto e se o botão pulsa ao abrir a página. A prévia aparece no canto desta página.
O código é só HTML e CSS, com o ícone em SVG e o link wa.me. O balão some em telas pequenas e a animação respeita quem prefere menos movimento.
Como usar
- Coloque o número com DDD e a mensagem.
- Ajuste posição, cor, tamanho e balão.
- Copie o código e cole antes do </body> do site.
Quando usar
- Sites de comércio e prestadores de serviço.
- Landing pages de campanhas.
- Sites em WordPress, Wix ou feitos à mão.
Perguntas frequentes
Onde colo o código?
Antes do fechamento </body>, em todas as páginas (ou no rodapé do tema). No WordPress, use um plugin de inserir código no rodapé ou o editor de tema. Em construtores como Wix e Webflow, use o campo de código personalizado do site.
Precisa de WhatsApp Business?
Não. O link wa.me funciona com qualquer conta de WhatsApp. O número vai com o código do país (55) e o DDD, só com números.
O botão deixa o site lento?
Não. O código é só HTML e CSS com o ícone em SVG, sem bibliotecas nem chamadas externas.
E se eu quiser mais de um botão?
Use outra posição (esquerda e direita) e gere o código de novo com outro número. Troque o id wa-flutuante no segundo código para não repetir.
É grátis mesmo?
Sim, 100% grátis. Sem cadastro, sem assinatura e sem limite de uso. Todas as ferramentas do Ferramentas123 são gratuitas e rodam direto no seu navegador.