---
description: Aprende cómo instalar un widget de chat web en tu sitio web de WordPress.
title: Instalar widget de chat en WordPress
image: https://assets1-proxy.respond.io/api/v1/image/assets%2F11f7a662b80a4675973850b067c01fa5%2F3f43c48b21b24f4e8b02b100c0c8fab0
---

[Nuevo🔥 ¡Sé el primero en probar la API de llamadas de WhatsApp Business (Beta abierta)!![arrow-icon](https://assets1-proxy.respond.io/api/v1/image/assets%2F11f7a662b80a4675973850b067c01fa5%2Fe43213a7a9314673bd8d2060c25f9b87)](/es/whatsapp-business-calling-api)

Ayúdame con... ⌘ 

1. [All Collections >](/es/help)
2. [ Canales >](/es/help/channels)
3. [ Widget de chat del sitio web >](/es/help/website-chat-widget)
4. Instalar widget de chat en WordPress

# Instalar widget de chat en WordPress

![Avatar](https://assets2-proxy.respond.io/ph8r57dk1q9w/7tin8k9c1emscQGOhIuNbC/0ed3f91c8580c4e5dfa90f035355122e/Petrina_Jo_avatar.svg)

JQ Lee

· 28 Aug 2025

3 min de lectura

Agregar un widget de chat web a su sitio web de WordPress es un proceso rápido y sencillo. No requiere habilidades de codificación ni conocimientos técnicos.

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/3je9y7R0f3NgEmslRx5Q6F/b2012551e43f584e0307aecd2fa23d0d/word-press-logo.png?fm=jpg&q=80&w=500) 

## Configuración para la instalación

Para instalar un widget de chat web en WordPress, necesitará lo siguiente:

* Acceso al panel de control de WordPress de tu sitio web.
* Un fragmento de código para su widget de chat web.

Si no tienes un fragmento de código ya, lo generarás al crear un [widget de chat en el sitio web](https://respond.io/es/help/website-chat-widget/website-chat-widget-overview) de respond.io o al usar el [plugin de chat de Facebook](https://respond.io/es/help/facebook-messenger/facebook-chat-plugin) para [Facebook Messenger](https://respond.io/es/help/facebook-messenger/facebook-messenger-overview).

> Si ya tiene los canales conectados en la plataforma respond.io y necesita recuperar el fragmento de código generado, siga las [instrucciones aquí](https://respond.io/es/help/website-chat-widget/website-chat-widget-overview#finding%5Fthe%5Fwebsite%5Fchat%5Fwidget%5Fcode%5Fafter%5Fconnecting%5Fthe%5Fchannel).

Para una instalación exitosa, asegúrate de que el dominio de tu sitio web esté completo. Hay dos maneras de hacerlo.

Vaya a respond.io **Configuración** \> seleccione **Canales** \> seleccione el canal de chat de su sitio web > haga clic en configurar > agregue el dominio del sitio web. 

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/1e7uaH6kDm1O7pGveCSLtj/cd6e069ed2d3ba023349b508560e3fab/screen-shot-2023-02-14-at-7-47-59-pm.png?fm=jpg&q=80&w=640) 

Vaya a la configuración de respond.io > seleccione **Widgets de crecimiento** \> haga clic en el widget que desea agregar a su sitio web > en el interruptor **General** , agregue el dominio de su sitio web al campo **Dominios del sitio web** .

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/3p3pQU8wHpzk061bqvS0Tr/65706ba2cdd4a08d5972ca1c7f0fe11f/chat-widget-settings.png?fm=jpg&q=80&w=640) 

## Instalación en WordPress

**Paso 1: Iniciar sesión en WordPress**

Navegue al panel de administración de WordPress de su sitio web e inicie sesión.

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/7BEtXv2z3DbKUr6hji7TOm/aeb0a76500168de0c4db1758459f36d4/install-webchat-on-word-press.png?fm=jpg&q=80&w=640) 

**Paso 2: Vaya a la página de complementos**

Desde el panel de navegación izquierdo, haga clic en **Plugins**. En la página de complementos, presione el botón azul **Agregar nuevo** en la parte superior de la página.

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/4yyIZmSrxmxdrhKGl8VcOl/b9881e62aab33064babb824daffbfe66/install-webchat-on-word-press-2.png?fm=jpg&q=80&w=640) 

**Paso 3: Agregar nuevo complemento**

Usando la barra de búsqueda, busque el complemento **WPCode** . Verá muchas opciones en la página de resultados de búsqueda que puede utilizar, pero utilizaremos el complemento "Insertar encabezado y pie de página" de WPCode para este tutorial. Presione el botón **Instalar ahora** y asegúrese de activar el complemento para poder usarlo.

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/5GGHqfES2lXgv5NzIoFz1P/15f02cef289ef90f490c4aecd1601ce7/add_new_plugin.png?fm=jpg&q=80&w=640) 

**Paso 4: Abra la consola de encabezados y pie de página**

Desde el menú de navegación de la izquierda, haga clic en Fragmentos de código y seleccione **Encabezado & Pie de página** en el submenú.

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/2DwpPlV3Td8AqC1JJByNz0/7806704ac1df123f86c8a1ecbe5a5afb/Screenshot_2025-04-09_at_5.34.35_PM.png?fm=jpg&q=80&w=640) 

**Paso 5: Agregar el script de chat en vivo**

Copie el script de su complemento desde respond.io y péguelo en la sección **Script en pie de página** de la página de la consola de encabezado y pie de página.

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/Ian351FEXVFMTGKlYGxmH/861c265623900ca5302d72ea4a4606ed/wpcode-live_chat_script.png?fm=jpg&q=80&w=640) 

Una vez que hayas pegado el script, haz clic en el botón azul "**Guardar**" en la parte inferior de la página.

**¡Hecho!**

Abra el sitio web y consulte el complemento de chat. Lo encontrarás en la esquina inferior derecha. Ahora los visitantes de tu sitio web pueden chatear contigo sin esfuerzo. 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 de chat ahora está activo en tu sitio web!

## Identificar usuarios registrados.

> Esta sección solo es aplicable si su sitio web tiene una función de inicio de sesión de usuario.

**Paso 1: Inicia sesión en tu cuenta de WordPress**

Navega al panel de administración de WordPress de tu sitio y accede.

**Paso 2: Abra los archivos de encabezado del tema**

Desde el menú de navegación de la izquierda, haga clic en **Apariencia** y seleccione **Editor de archivos de tema**. Procede seleccionando el archivo **Encabezado del tema**.

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/64VlcD24OVD9CUaFiK9U5B/91eb153aabead2673c1674395a0605a1/identify-logged-in-users.png?fm=jpg&q=80&w=640) 

**Paso 3: Agregue el ID de usuario y el código de nombre recuperados**

Copie el código de muestra a continuación y péguelo en el archivo de encabezado del tema. 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éntete libre de modificarlo si deseas obtener otros campos de contacto.

```html
<?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: Abra la consola de encabezados y pie de página**

Desde el menú de navegación izquierdo, haga clic en **Configuración** y seleccione el complemento **Encabezado & Pie de página** del submenú de configuración.

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/7gZgsdh0AM40EiyW1iCfQR/a5102c94de84f92388de60fe9b6f3602/wpcode-open_console.png?fm=jpg&q=80&w=640) 

**Paso 5: Agregar el script de identificación del usuario conectado**

Copie el código de muestra a continuación y péguelo en la sección **Script en pie de página** de la página de la consola de encabezado y pie de página. Tenga en cuenta que el **script para identificar usuarios conectados** debe colocarse por encima del **script de chat en vivo**.

> El código de muestra a continuación utiliza el Id. del usuario como identificador y lo pasa junto con el nombre y el apellido. Siéntete libre de modificarlo si deseas obtener otros campos de contacto.

```html
<script>  
      ventana.\_\_respond\_configuraciones = {  
    	identificador: $wp\_ID,  
        nombre: $wp\_nombre,  
        apellido: $wp\_apellido,    
      };  
</script>
```

Una vez que hayas pegado el script, haz clic en el botón azul "**Guardar**" en la parte inferior de la página.

**¡Hecho!**

Abra el sitio web y consulte el complemento de chat. Se podrán identificar los usuarios que hayan iniciado sesión en su WordPress. Una vez que el identificador pasado coincida con un contacto existente, se reanudará la conversación actual.

## Preguntas frecuentes y resolución de problemas

### WPCode

Si estás utilizando un plugin de caché de WordPress como WPCode, sigue estos pasos para que el widget aparezca correctamente.

**Desactiva la función de minificación de datos para JavaScript.**

Ve a **Ajustes de Wordpress** \> Selecciona **WPCode** \> En la página de WPCode, selecciona la pestaña **Optimización de Archivos** \> desmarca **Minificar archivos JavaScript**

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/7u1DdW6UTB1nHdrE0QlgIB/f3412a5f90adf94cab31a67c4a42d108/css-and-js-files-minified-source-wp-rocket.png?fm=jpg&q=80&w=640) 

**Agrega nuestro dominio de widget a los Archivos Excluidos de JavaScript**

`https://cdn.respond.io/webchat/widget/(.*).js`

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/3TcEXrKx1zKh7IhvT4G7Cp/6308494d1b35b918e250d3ebc387b87e/wp-rocket-javascript-excluded-files.png?fm=jpg&q=80&w=640) 

> Una vez guardado, se recomienda limpiar la caché en WordPress.

Compartir este artículo

[![Telegram](https://assets1-proxy.respond.io/api/v1/image/assets%2F11f7a662b80a4675973850b067c01fa5%2F44daca77a4844f0c8fd29040ddeba057?width=22)](https://api.whatsapp.com/send?text=https://respond.io/help/website-chat-widget/install-on-wordpress)[![Facebook](https://assets1-proxy.respond.io/api/v1/image/assets/11f7a662b80a4675973850b067c01fa5/fff57eeb01160bc604392f519b4f3461ca16f0fa1b6a587b20b142cdf1ad0ba7?placeholderIfAbsent=true&width=22)](https://www.facebook.com/sharer/sharer.php?u=https://respond.io/help/website-chat-widget/install-on-wordpress)[![Linkedin](https://assets1-proxy.respond.io/api/v1/image/assets/11f7a662b80a4675973850b067c01fa5/7aaf8d87b5410844d83e06a4ed663e4f551b8c5ef51dbb20a8ff064a1eed9a0f?placeholderIfAbsent=true&width=22)](https://www.linkedin.com/sharing/share-offsite/?url=https://respond.io/help/website-chat-widget/install-on-wordpress)[![Twitter](https://assets1-proxy.respond.io/api/v1/image/assets%2F11f7a662b80a4675973850b067c01fa5%2F4e03e02422a94e8eab9b8b41457c2371?width=22)](http://twitter.com/share?url=https://respond.io/help/website-chat-widget/install-on-wordpress)

## 

Artículos relacionados 👩‍💻

* [Instalar Widget de Chat Web en SquarespaceAprenda cómo instalar un widget de chat web en su sitio web de Squarespace. ](/es/help/website-chat-widget/install-on-squarespace)
* [Instalar el widget de chat del sitio web en JoomlaAprende cómo instalar un widget de chat web en tu sitio web de Joomla. ](/es/help/website-chat-widget/install-on-joomla)
* [Instalar el widget de chat en el sitio web en WixAprende cómo instalar un widget de chat web en tu sitio web de Wix. ](/es/help/website-chat-widget/install-on-wix)
* [Instalar widget de chat en ShopifyAprende cómo instalar un widget de chat web en tu tienda Shopify. ](/es/help/website-chat-widget/install-on-shopify)
* [Inicio rápido del widget de chat del sitio webAgregue el widget de chat del sitio web respond.io a su sitio. ](/es/help/website-chat-widget/website-chat-widget)

¿No encuentras lo que estás buscando? 🔎

[Contacta a Soporte](/es/contact-us)

2025-12-05T03:56:42.913Z

help

```json
[{"@context":"https://schema.org","@type":"TechArticle","articleBody":"Aprende cómo instalar un widget de chat web en tu sitio web de WordPress.","author":{"@type":"Person","image":"https://assets2-proxy.respond.io/ph8r57dk1q9w/7tin8k9c1emscQGOhIuNbC/0ed3f91c8580c4e5dfa90f035355122e/Petrina_Jo_avatar.svg","name":"JQ Lee","url":"https://respond.io/es/author"},"dateCreated":"2023-03-01T07:06:53.000Z","dateModified":"2025-08-28T08:51:51.275Z","datePublished":"2023-03-01T07:06:53.000Z","headline":"Instalar widget de chat en WordPress","image":"https://assets2-proxy.respond.io/ph8r57dk1q9w/3je9y7R0f3NgEmslRx5Q6F/b2012551e43f584e0307aecd2fa23d0d/word-press-logo.png","mainEntityOfPage":"https://respond.io/es/help/website-chat-widget","publisher":{"@type":"Organization","logo":"https://respond.io/favicon/favicon.svg","name":"respondio"},"thumbnailUrl":"https://assets2-proxy.respond.io/ph8r57dk1q9w/3je9y7R0f3NgEmslRx5Q6F/b2012551e43f584e0307aecd2fa23d0d/word-press-logo.png","url":"https://respond.io/es/help/website-chat-widget/install-on-wordpress"},{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","name":"Help","item":"https://respond.io/es/help","position":1},{"@type":"ListItem","name":"Canales","item":"https://respond.io/es/help/channels","position":2},{"@type":"ListItem","name":"Widget de chat del sitio web","item":"https://respond.io/es/help/website-chat-widget","position":3},{"@type":"ListItem","name":"Instalar widget de chat en WordPress","item":"https://respond.io/es/help/website-chat-widget/install-on-wordpress","position":4}]}]
```
