Añadir un widget de chat web a tu sitio de WordPress es un proceso rápido y sencillo. No requiere ninguna capacidad de codificación o conocimientos técnicos.
Para instalar un widget de chat web en WordPress, necesitará lo siguiente:
Acceso al panel de control de WordPress de tu sitio.
Un fragmento de código para tu widget de chat web.
Si no tienes un fragmento de código ya, lo generarás al crear un widget de chat web o al usar el plugin de chat de Facebook para Facebook Messenger.
Si ya tienes los canales conectados en la plataforma respond.io y necesitas recuperar el fragmento de código generado, sigue las instrucciones aquí.
Para una instalación exitosa, asegúrese de que el dominio de su sitio web está rellenado. Hay dos maneras de proceder.
Vaya a respond.io Ajustes > seleccione Canales > seleccione el canal de chat de su sitio web > haga clic en configurar > añadir dominio del sitio web.
Ve a la configuración de Respond.io > selecciona Widgets de Crecimiento > haz clic en el widget que deseas agregar a tu sitio web > en el alternador General, agrega el dominio de tu sitio web en el campo Dominios del Sitio Web.
Paso 1: Inicia sesión en WordPress
Navega al panel de administración de WordPress de tu sitio web e inicia sesión.
Paso 2: Navegar a la página de plugins
Desde el panel de navegación izquierdo, haga clic en Plugins. En la página de complementos, presione el azul Añadir nueva botón en la parte superior de la página.
Paso 3: Añadir nuevo plugin
Usa la barra de búsqueda para buscar el complemento WPCode. Verás muchas opciones en la página de resultados de búsqueda, pero utilizaremos el complemento "Insertar encabezado y pie de página" de WPCode para este tutorial. Pulsa el botón Instalar ahora y asegúrate de activar el plugin para hacer uso de él.
Paso 4: Abrir cabeceras y consola de pie de página
Desde el menú de navegación de la izquierda, haz clic en Fragmentos de código y selecciona Encabezado & Pie de página del submenú.
Paso 5: Agregar el guión del chat en vivo
Copie el script del plugin de respond.io y péguelo en la sección Script en el pie de página de la página de la consola del encabezado y del pie de página.
Una vez que haya pegado el script, haga clic en el azul "Guardar" botón en la parte inferior de la página.
¡Listo!
Abre el sitio web y echa un vistazo al plugin de chat. La encontrará en la esquina inferior derecha. Ahora los visitantes de tu sitio web pueden chatear sin esfuerzo contigo. Si utilizaste los fragmentos de código generados desde la plataforma respond.io, podrás administrar las conversaciones y actualizar la apariencia del widget desde la plataforma.
¡El widget del chat está ahora activo en su sitio web!
Esta sección sólo es aplicable si su sitio web tiene una característica de inicio de sesión de usuario.
Paso 1: Inicie sesión en la cuenta de WordPress
Vaya a su sitio web's Panel de administración de WordPress e inicie sesión.
Paso 2: Abrir los archivos de encabezado de temas
En el menú de navegación izquierdo, haga clic en Apariencia y seleccione Editor de archivos de tema. Proceda a seleccionar el archivo encabezado de temas.
Paso 3: Agregar el ID de usuario recuperado y el código de nombre
Copie el código de muestra abajo y péguelo en el archivo de encabezado de temas. Una vez que haya pegado el código, haga clic en el botón Actualizar archivo en la parte inferior de la página.
El código de muestra a continuación sirve para obtener el ID del usuario, el nombre y el apellido de WordPress. Siéntase libre de modificar si desea obtener otros campos de contacto.
<?php
$user_info = get_userdata(get_current_user_id());
?>
<script type="text/javascript">
window.$wp_ID = "<?php echo $user_info->ID; ?>";
window.$wp_firstname = "<?php echo $user_info->first_name; ?>";
window.$wp_lastname = "<?php echo $user_info->last_name; ?>";
</script>`
Paso 4: Abrir cabeceras y consola de pie de página
Desde el menú de navegación de la izquierda, haz clic en Configuración y selecciona el complemento Encabezado & Pie de página del submenú de configuración.
Paso 5: Agregar el script de usuario identificado
Copia el código de muestra abajo y pégalo en la sección Script en el pie de la página de la consola de encabezado y pie de página. Ten en cuenta que el script de identificación de usuario conectado debe colocarse por encima del script de chat en vivo.
El siguiente código de ejemplo utiliza el identificador de usuario y pasa junto con el nombre de usuario y apellido. Siéntase libre de modificar si desea obtener otros campos de contacto.
<script>
window.\_\_respond\_settings = {
identifier: $wp\_ID,
nombre: $wp\_firstname,
apellido: $wp\_lastname,
};
</script>Una vez que haya pegado el script, haga clic en el azul "Guardar" botón en la parte inferior de la página.
¡Listo!
Abre el sitio web y echa un vistazo al plugin de chat. Los usuarios registrados de tu sitio WordPress pueden ser identificados. Una vez que el identificador pasado se iguale con un contacto existente, la conversación actual se reanudará.
Si está utilizando un complemento de caché de WordPress como WPCode, siga estos pasos para que el widget aparezca correctamente.
Desactiva la función de minificación de datos para JavaScript.
Ve a Configuración de WordPress > Selecciona WPCode > En la página de WPCode, selecciona la pestaña Optimización de Archivos > desmarca Minificar archivos JavaScript.
Añade nuestro dominio del widget a los archivos de JavaScript excluidos.
https://cdn.respond.io/webchat/widget/(.*).js
Una vez guardado, se recomienda limpiar la caché en WordPress.
Artículos relacionados 👩💻