Saltar al contenido principal
móvil

Integra Whatsapp Click to Chat en WordPress

por 27 de julio de 2020#!31 Vie, 07 Ago 2020 17:24:57 +0200+02:005731#31 Vie, 07 Ago 2020 17:24:57 +0200+02:00-5Europe/Rome3131Europe/Rome202031 07pm31pm-31 Vie, 07 Ago 2020 17:24:57 +0200+02:005Europe/Rome3131Europe/Rome2020312020 Vie, 07 Ago 2020 17:24:57 +0200245248pmviernes=3816#!31 Vie, 07 Ago 2020 17:24:57 +0200+02:00Europe/Rome8#7 de agosto de 2020#!31Vie, 07 ago. 2020 17:24:57 +0200+02:005731#/31Vie, 07 ago. 2020 17:24:57 +0200+02:00-5Europe/Rome3131Europe/Rome202031#!31Vie, 07 ago. 2020 17:24:57 +0200+02:00Europe/Rome8#No hay comentarios

1. Encuentra un ícono de Whatsapp

Primero, necesitamos un ícono en el que el usuario pueda hacer clic. Hay muchos sitios de imágenes libres de regalías para elegir. Descarga un ícono que te guste, súbelo a la sección multimedia y, por ahora, añade la URL al margen.

2. Defina los parámetros

Hay 2 parámetros que debes decidir:

  1. El número de teléfono al que desea enviar el mensaje. WhatsApp
  2. El mensaje que se le enviará

3. Ponlo todo junto

Aquí está tu botón:

< A href = "Https://api.whatsapp.com/send?phone=00155555555&text=I estoy interesado en su servicio" objetivo = "_Blanco" clase = "Whatsapp" >
< img src = "Https://site.com/wp-content/uploads/2018/07/whatsapp.png" alt = "Whatsapp" >
< / a >

Copie lo anterior, pero asegúrese de cambiar el número de teléfono y el mensaje.

4. Pega el código

Por el bien de este tutorial colocaremos el icono en la parte inferior izquierda de la pantalla y le daremos una posición fija para que no lo pierdas.

Entonces, para hacer esto, pegaré el código de arriba en mi footer.phparchivo justo antes del cuerpoetiqueta de cierre .

Una vez que guarde el archivo y actualice el navegador, podré ver el ícono al final de la página. Ahora, vamos a darle estilo.

5. Dibuja el botón de Whatsapp

Lo único que tienes que hacer es escribir unas pocas líneas. CSSy pégalo en el tuyo style.cssexpediente.

.Whatsapp {
posición: fija;
izquierda: 5px;
abajo: 65px;
}

Como pueden ver, coloqué mi ícono a 5 píxeles de la izquierda de la pantalla y a 65 píxeles de la parte inferior. Lo hice porque bloqueaba parte del texto del pie de página al desplazarme hasta la parte inferior de la página, pero pueden experimentar con él a su gusto.

6. El momento de la verdad

Todo lo que necesitas hacer ahora es actualizar la página, asegurarte de que te gusta dónde está ubicado el ícono, hacer clic en él y asegurarte de que te transfieran a WhatsApp para enviar tu mensaje.

Si bien este tutorial debería ser increíblemente fácil de realizar en su sitio, si aún necesita un complemento, aquí hay un complemento que lo ayudará a implementar un botón de clic para llamar de WhatsApp.

Haga clic en Chat para charlar de WhatsApp

Haga clic en Chat para el chat de WhatsApp

Este plugin cuenta con 10 estilos de diseño diferentes y es muy fácil de usar. Otras características:

  • Elija su icono / imagen
  • animaciones
  • Estilo en una página / publicación específica
  • Define tu mensaje
  • Compatibilidad con eventos de Google Analytics y Tag Manager
  • Soporte para eventos de Facebook

Dejar una respuesta