Cómo añadir el botón flotante de Whatsapp en tu sitio

Cómo añadir el botón flotante de Whatsapp en tu sitio

Añadir el botón flotante de Whatsapp dentro de tu sitio Wordpress + Divi es muy sencillo:

Dentro del Escritorio ve a la sección del menú lateral izquierdo Divi > Opciones del tema > Integraciones



Una vez allí en el cuado de código <body> añade el siguiente código y sustituir el número de color azul por el teléfono de Whatsapps que desees:

Notes
<!-- Font Awesome CDN -->
<link rel="stylesheet"
 href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">

<!-- Botón flotante WhatsApp -->
<a href="https://wa.me/34123456789?text=Hola%20👋%20Quiero%20información"
class="wa-float"
target="_blank"
aria-label="Chatear por WhatsApp">
<i class="fa-brands fa-whatsapp"></i>
</a>

<style>
.wa-float{
  position:fixed;
  bottom:20px;
  right:20px;
  width:60px;
  height:60px;
  background:#25D366;
  color:#fff;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:30px;
  text-decoration:none;
  box-shadow:0 10px 25px rgba(0,0,0,.25);
  z-index:9999;
  transition:.2s;
}
.wa-float:hover{
  transform:scale(1.08);
}
</style>



Para finalizar haz clic en el botón "Guardar cambios"



    • Popular Articles

    • Guía de Negocio para Partners

      PLAN DE NEGOCIO: Tu Agencia de IA en 30 días (Documento Confidencial para aspirantes a Partner) Lo que estás a punto de ver es el primer Sistema Multi-agente de IA para Pymes. Puede crearte Webs en minutos, Empleados de IA, Automatizar Blogs, Redes ...
    • Ver una Demo de Scoreapps para Resellers

      En este vídeo te explicamos el modelo de negocio, los tipos de Apps que puedes crear y las distintas herramientas que incluye Scoreapps en su Plan de Resellers: Y en este otro vídeo te enseñamos cómo funciona el software por dentro:
    • Proporciona acceso a tus Aplicaciones

      Con el Plan Reseller o Plan Partner puedes otorgar fácilmente a tus clientes o colaboradores acceso a tus aplicaciones. Accede a tu Panel de Apps, y después accede a cualquier Aplicación: Una vez dentro del constructor de Apps, ve a Mi Cuenta - ...
    • Cómo Crear una App de Tienda

      El comercio electrónico desde dispositivos móviles se disparó desde comienzos de 2020 debido a la Pandemia del Covid19 y sigue creciendo a tasas del 45% anual. Hoy en día, contar con una App de Tienda resulta imprescindible para cualquier negocio de ...
    • Cómo diseñar la pantalla de inicio o portada de una App

      En el video que te mostramos a continuación te explicamos cómo diseñar la pantalla de inicio de una App:
    • Related Articles

    • Cómo personalizar el Dominio de tu sitio Web

      Antes de personalizar el dominio de tu sitio Web debes configurar tu propio servidor de SMTP para el correcto funcionamiento del envío de emails siguiendo los pasos que indicamos en nuestro artículo: Configuración de SMTP para cada sitio web De lo ...
    • Uso de las Opciones de Sombra de Caja en Divi

      Las opciones de sombra de caja en Divi te permiten darle a cualquier elemento de la página la ilusión de profundidad. Las sombras proyectadas son una forma creativa de dar vida a los elementos de diseño de tu sitio web. Pueden resaltar elementos e ...
    • Cómo usar los formatos de publicaciones de blog en Divi

      Divi incluye soporte para formatos de publicación de video, audio, enlaces y citas. Personalizar el diseño de las publicaciones del blog es una excelente manera de hacer que tu contenido y página web se destaquen. La forma recomendada de hacerlo ...
    • El sistema de gestión de colores de Divi

      Cómo usar las opciones avanzadas de color de Divi. El sistema de gestión de colores de Divi ha evolucionado a lo largo de los años para convertirse en uno de los sistemas de color más robustos en el universo de WordPress. El sistema de colores de ...
    • El Módulo de Botón de Divi

      Cómo agregar, configurar y personalizar el módulo de botón de Divi. &amp;lt;br&amp;gt; El módulo de botón de Divi es versátil y se puede usar en todo tu sitio web. Crea estilos divertidos al pasar el cursor, usa íconos personalizados y guía a los ...