Botão flutuante do WhatsApp

Por que usar um Botão do WhatsApp no seu Blog?

Blogueiros que oferecem suporte ou vendem produtos digitais precisam de agilidade. Um botão flutuante:

• Aumenta a Confiança: Mostra que existe uma pessoa real por trás do conteúdo.
• Melhora a Experiência (UX): O leitor não precisa procurar a página de contato.
• Design Profissional: Mantém a estética limpa, flutuando discretamente no canto da tela.

---

Código HTML e CSS para Copiar

Aqui está o código básico para você adicionar ao seu template:

<link rel="stylesheet" href="https://cdn.positus.global/production/resources/robbu/whatsapp-button/whatsapp-button.css">
<a id="robbu-whatsapp-button" target="_blank" href="https://api.whatsapp.com/send?phone=55AQUI O NUMERO DO SEU TELEFONECOM O CODIGO DDD">
  <div class="rwb-tooltip">Fale conosco</div>
  <img src="https://cdn.positus.global/production/resources/robbu/whatsapp-button/whatsapp-icon.svg">
</a>

Modelo 2

<div style="position: fixed; bottom: 20px; right: 20px; z-index: 999;">
  <a href="https://wa.me/55AQUI O NUMERO DE SEU TELEFONE COM DDD?text=Contact" target="_blank" style="display: inline-block; padding: 12px 20px; background-color: #25D366; color: white; border-radius: 5px; text-decoration: none; font-family: sans-serif; font-size: 16px;">
    <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/6/6b/WhatsApp.svg/2044px-WhatsApp.svg.png" alt="WhatsApp" style="height: 24px; vertical-align: middle; margin-right: 8px;">
WhatsApp
  </a>
</div>

Modelo 3

<link rel="stylesheet" href="https://cdn.positus.global/production/resources/robbu/whatsapp-button/whatsapp-button.css">
<a id="robbu-whatsapp-button" target="_blank" href="https://api.whatsapp.com/send?phone=55SEUTELEFONEAQUI&text=SEU TEXTO AQUI">
  <div class="rwb-tooltip">Fale conosco</div>
  <img src="https://cdn.positus.global/production/resources/robbu/whatsapp-button/whatsapp-icon.svg">
</a>