Cómo instalar y configurar el widget de chat en línea

El widget de Umnico es un botón en su sitio web que permite a los visitantes ponerse en contacto con usted a través del chat online, Telegram, VKontakte y otros mensajeros. Todos los mensajes se reciben en una única ventana de Umnico.

Para instalar el chat web, cree y configure el widget en la sección "Channels" → "Website chat", copie el código y añádalo a las páginas de su sitio web.

1. Vaya a la sección "Channels" → "Website chat"

En el menú de la izquierda, haga clic en "Channels". La página tiene dos pestañas: "Main" — para mensajeros, y "Website chat" — para configurar el widget.

Abra la pestaña "Website chat". La pestaña "Website chat" se encuentra en la sección "Communication channels".

Adding Umnico Live Chat widget

2. Cree un nuevo widget

Haga clic en "+ Website chat" junto a la pestaña.

Asigne un nombre al widget. Este se muestra únicamente en su cuenta — los visitantes del sitio web no lo verán. Si tiene varios sitios web o landing pages, asigne nombres a los widgets según su propósito, por ejemplo: "Main website", "Landing page May 2025", "Online store". Esto facilitará distinguir los widgets entre sí.

3. Configure el widget de chat web

Después de crear el widget, se abrirá un editor con varias secciones. Configure los parámetros del widget en cada una de ellas.

Configuración

En esta sección puede especificar el nombre del widget, la zona horaria, el horario de trabajo, el color del botón y la posición del botón (izquierda o derecha).

Configuring Umnico Live Chat

Chat online

Active el chat online, seleccione el color de la ventana y de los mensajes y configure la apertura automática del chat después de N segundos.

Welcome chat window

Mensajeros

Añada enlaces a sus mensajeros — Telegram, VKontakte, MAX y otros. El visitante del sitio web podrá elegir dónde enviar el mensaje.

Messengers tab

Respuestas rápidas

Configure sugerencias para los visitantes — preguntas frecuentes que podrán enviar con un solo clic. Idiomas disponibles: RU, EN, DE, ES, PT.

Quick replies tab

4. Copie el código del widget

Desplácese hacia abajo hasta la sección "Installation" y copie el código para añadirlo a su sitio web. La sección "Installation" contiene el código único de su cuenta.

Widget settings

No utilice el código de otra persona: cada cuenta tiene su propio hash. El código del ejemplo anterior no funcionará.

5. Instale el código en su sitio web

Inserte el código copiado en cada página del sitio web antes de la etiqueta de cierre </body>.

Elija su plataforma:

Sitio web personalizado

  1. Abra el archivo de plantilla que se incluye en todas las páginas (normalmente layout.html, base.html o footer.php).
  2. Busque la etiqueta de cierre </body>.
  3. Inserte el código del widget justo antes de ella.
  4. Guarde el archivo y compruebe su sitio web — el widget aparecerá en la esquina inferior derecha.

Tilda

  1. Abra el editor del sitio web correspondiente en Tilda.
  2. Vaya a Site Settings → More → HTML code for insertion.
  3. En el campo "Code before </body>", inserte el código del widget.
  4. Haga clic en "Save" y publique el sitio web.

El código se añade una sola vez para todo el sitio web — no es necesario insertarlo por separado en cada página.

WordPress

  1. Instale el plugin Insert Headers and Footers (o WPCode).
  2. Vaya a Settings → Insert Headers and Footers.
  3. Inserte el código del widget en el campo Scripts in Footer.
  4. Haga clic en "Save".

Si tiene acceso al editor del tema: Appearance → Editor → footer.php → inserte el código antes de </body>. Sin embargo, el plugin es más fiable — el código no se eliminará al actualizar el tema.

Bitrix

  1. Inicie sesión en el panel administrativo de Bitrix.
  2. Vaya a Settings → Sites and Servers → Sites.
  3. Seleccione el sitio web correspondiente → pestaña HTML code of pages.
  4. Inserte el código del widget en el campo "Before </body>".
  5. Guarde los cambios.

React

Si su aplicación utiliza Create React App, inserte el código en public/index.html antes de </body>.

Si utiliza Next.js, añádalo mediante el componente Script en _app.js o layout.tsx.

6. Compruebe que el chat web funciona

Abra su sitio web en un navegador. El botón del chat debería aparecer en la esquina inferior derecha.

Haga clic en el botón y envíe un mensaje de prueba. Aparecerá en la sección "Chats" de su cuenta de Umnico.

También puede probar el envío de mensajes dentro de la interfaz de Umnico. Para ello, haga clic en el botón "Test chat".

¿No aparece el widget? Compruebe que: el código está insertado en todas las páginas (no solo en la página de inicio); el hash se ha copiado completamente y sin espacios adicionales; la página se ha guardado y publicado después de realizar los cambios.

Ayuda y Soporte

Si tiene alguna pregunta, no dude en contactar con nosotros — estaremos encantados de ayudarle. Para contactar con el soporte de Umnico, haga clic en la burbuja "Soporte" en la esquina inferior derecha de su pantalla. O vaya a la sección "Ayuda → Chat con el Soporte" en su cuenta personal.

Guías y Artículos Relacionados

Le recomendamos explorar

Análisis de visitantes
Conocimientos de mecanografía

Volver a la lista de artículos

Prueba todas las funciones de Umnico

Prueba todas las funciones de Umnico

Período de prueba gratuito para nuevos usuarios

Regístrarse