Cómo llamar al widget desde un botón en Elementor
Si estas utilizando el tema Elementor WordPress, hay dos formas de permitir que tus visitantes inicien un chat desde tu sitio:
- Agregar un enlace de chat directo a un botón personalizado o un enlace para abrir el chat en una nueva ventana o pestaña del navegador
- Usar código para llamar al widget de chat desde un botón
En este artículo, vamos a mostrarte cómo usar un fragmento de código personalizado para llamar al widget de chat desde un botón en un sitio de Elementor.
Nota: primero debes agregar un widget tawk.to a tu sitio antes de seguir los siguientes pasos.
Aprendas cómo agregar un widget tawk.to a tu sitio de WordPress aquí: Agregar un widget tawk.to a tu sitio web de WordPress
Primero, inicia sesión en tu panel administrativo de WordPress y selecciona una página para editar.
Luego, haz clic en el botón Edit with Elementor "Editar con Elementor":

Haz clic en un botón para abrir el menú Edit Button "Editar botón".

Luego, selecciona la pestaña Advanced "Avanzado".

En el campo ID de CSS, ingresa un nombre de ID personalizado para el botón (por ejemplo, widget_button).
Asegúrate de recordar este nombre; lo usarás en le código JavaScript.

En tu tablero de WordPress, selecciona Appearance "Apariencia" en el menú de la izquierda. Luego, selecciona Theme File Editor "Editor de archivos de temas".

En la parte superior derecha, selecciona el tema actual. Luego, en Theme Files "Archivos de tema", seleccione Footer "Pie de página".

Agrega el siguiente código JavaScript al código HTML del pie de página justo antes de la etiqueta </body>:
Asegúrate de que la ID de CSS en JavaScript sea idéntica a la ID de CSS en el código.
Luego, haz clic en el botón Actualizar archivo.

Después de agregar el código, actualiza tu sitio web de WordPress y prueba la nueva característica haciendo clic en el botón para abrir el widget.

Si necesita más ayuda, comunícate con nuestro equipo de soporte o programa una llamada.