Configurar los ajustes del widget

Personaliza tu widget de autoservicio para adaptarlo a tu marca y flujo de soporte. Cada ajuste muestra una vista previa en tiempo real mientras editas.

Acceder a los ajustes del widget

Abre el panel de personalización del widget desde el panel de control. Las secciones que aparecen a continuación se muestran en el panel en el mismo orden que en este artículo.

1. Abre tu panel de control de Ferndesk.

2. Ve a Centro de ayuda → Widget.

3. Haz clic en Personalizar en la tarjeta del widget que quieras personalizar.

Administrar widgets

Tu organización puede usar varios widgets, uno por sitio o aplicación. En Centro de ayuda → Widget, el panel de widgets muestra todos los widgets en el orden en que se crearon y la lista se actualiza cada vez que abres la página, por lo que los widgets que un compañero haya añadido o eliminado aparecen sin necesidad de recargarla. Cada tarjeta muestra una vista previa en tiempo real, su actividad de los últimos 30 días (impresiones, búsquedas y visualizaciones de artículos), y las acciones Personalizar e Instalar, además de un menú con Cambiar nombre y Eliminar.

Crear un widget

1. En Centro de ayuda → Widget, haz clic en Nuevo widget.

2. Escribe un nombre y haz clic en Crear widget. Se abrirá la página de personalización del nuevo widget.

El primer widget omite el nombre: haz clic en Crear widget en la página de Widget vacía y se creará con el nombre predeterminado Widget de ayuda.

Cambiar el nombre de un widget

Abre el menú de la tarjeta del widget y selecciona Cambiar nombre; después, haz clic en Guardar nombre. El nombre solo se muestra a tu equipo, para que puedas distinguir tus widgets.

Eliminar un widget

Abre el menú de la tarjeta del widget y selecciona Eliminar; después, haz clic en Eliminar widget en la confirmación. Cualquier sitio o aplicación que haya instalado el fragmento de código del widget dejará de mostrarlo poco después de la eliminación. El texto, las traducciones y los ajustes de contacto del widget también se eliminan, y esta acción no se puede deshacer.

La confirmación muestra la frecuencia con la que se cargó el widget en los últimos 30 días, para que puedas comprobar si los sitios todavía lo usan antes de eliminarlo.

Marca

Controla la identidad visual de tu widget: logotipo, colores y fuentes.

• Logotipo: sube un archivo PNG, JPG o SVG (se recomiendan 512x512 px)

• Color principal: color de marca para botones y elementos destacados

• Esquema de color: elige el modo del sistema, claro u oscuro

• Fuente de títulos y Fuente del cuerpo: elige entre las fuentes de Google

Lanzador

El lanzador es el botón flotante en el que hacen clic los visitantes para abrir el widget. Personaliza su apariencia y ubicación en la página.

Botón

• Color del botón: color de fondo del botón del lanzador

• Icono del botón: icono que se muestra dentro del botón del lanzador

• Color del icono del botón: color del icono. Déjalo vacío para detectarlo automáticamente según el contraste con el fondo del botón o elige un color hexadecimal específico

• Texto del botón: etiqueta opcional que se muestra junto al icono. Déjalo vacío para mantener el lanzador solo con el icono. Admite hasta 40 caracteres, por ejemplo, "¿Preguntas?" o "Ver documentación"

• Tamaño: tamaño del icono dentro del lanzador (16–32 píxeles, predeterminado: 24)

• Redondeado: elige Completo para el lanzador con forma de píldora o Personalizado para establecer tu propio Radio de esquina (0–32 píxeles)

Posición

Elige dónde aparece el botón del lanzador en la página:

• Izquierda: coloca el lanzador en la esquina inferior izquierda

• Derecha: coloca el lanzador en la esquina inferior derecha (predeterminado)

El panel del widget se abre desde el mismo lado que la posición del lanzador. Un lanzador en la parte inferior izquierda abre el panel desde la izquierda y uno en la parte inferior derecha lo abre desde la derecha.

Margen

Controla el espacio alrededor del botón del lanzador:

• Desplazamiento lateral: distancia desde el borde izquierdo o derecho de la ventana gráfica (0–128 píxeles, predeterminado: 32)

• Desplazamiento inferior: distancia desde el borde inferior de la ventana gráfica (0–128 píxeles, predeterminado: 32)

Relleno

• Relleno del lanzador: espacio interno alrededor del icono dentro del botón (8–40 píxeles, predeterminado: 16)

Encabezado

Establece el título y el fondo de la parte superior del panel del widget.

• Título: encabezado principal (predeterminado: "¿Cómo podemos ayudarte?")

• Fondo: elige un color, una imagen o un degradado para el encabezado

  • Color: selecciona un color de fondo sólido

  • Imagen: elige una imagen de Plantillas o Unsplash, o sube la tuya

  • Degradado: selecciona un fondo degradado predefinido

Respuestas de IA

Activa el chat con tecnología de IA para ayudar a los clientes a encontrar respuestas mediante consultas en lenguaje natural. Cuando está activado, el widget muestra una interfaz de chat que sintetiza respuestas a partir de tus artículos publicados con citas integradas.

Este interruptor solo activa las respuestas de IA para el widget. El comportamiento de las respuestas es un ajuste del asistente compartido, no del widget: el tono, la longitud de las respuestas, las capturas de pantalla, las instrucciones permanentes y los temas restringidos se administran una sola vez en Ajustes → Asistente de IA y se aplican tanto al centro de ayuda como al widget. Consulta Personalizar el asistente de IA para ver las opciones disponibles.

Enlaces

Añade hasta 5 enlaces de acceso rápido a tu widget. Arrástralos y suéltalos para reordenarlos.

Cada enlace incluye:

• Icono: elige entre los iconos disponibles

• Etiqueta: texto del enlace

• URL: destino (interno o externo)

• Abrir en una pestaña nueva: activa o desactiva si el enlace se abre en una pestaña nueva del navegador. Desactívalo para abrir el enlace en la misma pestaña. Tu sitio también puede escuchar los clics mediante el SDK de Ferndesk.

Contacto

Elige cómo pueden ponerse en contacto los clientes con tu equipo de soporte. La sección Contacto tiene cuatro pestañas: Formulario, Enlace, Chat y Ninguno.

Formulario

Muestra un formulario de contacto que envía los mensajes a tu correo electrónico de soporte. Los visitantes pueden adjuntar archivos de imagen a sus mensajes.

Requisitos de los archivos adjuntos

Cuando los visitantes adjuntan imágenes a su mensaje de contacto, se aplican los siguientes límites:

• Tipos de archivo: JPEG, PNG, GIF, WebP, HEIC, HEIF

• Tamaño por archivo: hasta 5 MB por archivo

• Número máximo de archivos: hasta 3 imágenes por mensaje

• Tamaño total: hasta 15 MB en conjunto

Ajustes del formulario de contacto

Configura:

• Dirección de correo electrónico de soporte: dónde se envían los mensajes

• Título del contacto: encabezado de la página de contacto

• Descripción del contacto: explicación breve

• Texto del botón: etiqueta del botón de envío (predeterminado: "Ponerse en contacto")

Enlace

Redirige a los usuarios a una página de soporte externa o a un sistema de gestión de tickets.

• URL del enlace de contacto: URL de destino

• Texto del botón: etiqueta del botón

Chat

Transfiere la conversación a tu plataforma de chat existente cuando los visitantes hacen clic en el botón de contacto. El widget de chat permanece oculto hasta que Ferndesk lo abre, por lo que los visitantes ven primero tu contenido de autoservicio.

Plataformas compatibles:

• Intercom: abre Intercom Messenger

• Crisp: abre Crisp Live Chat

• Help Scout: abre Help Scout Beacon

• Pylon: abre el widget de chat de Pylon

• Zendesk: abre Zendesk Web Widget

• Plain: abre el widget de chat de Plain

Ninguno

Oculta la opción de contacto para ofrecer una asistencia totalmente basada en el autoservicio.

Estrategia de escalamiento

Controla cuándo el asistente de IA ofrece una vía para contactar con tu equipo durante las conversaciones del widget.

En Comportamiento de transferencia de IA, selecciona La IA decide, Siempre visible o Desactivado. Consulta Comportamiento de escalamiento y transferencia de IA para saber cómo funciona cada opción.

Activa Redactar un resumen de la transferencia para que la IA genere un resumen de la conversación antes de transferirla.

Traducciones

Traduce las cadenas de la interfaz de tu widget a varios idiomas. Los visitantes ven el widget en el idioma que coincide con el idioma principal de tu centro de ayuda o con el idioma que hayan seleccionado.

Las traducciones del widget se sincronizan con los idiomas de tu centro de ayuda. Añade primero los idiomas en Centro de ayuda → Traducir. Para cada idioma:

1. Selecciona un campo para traducir.

2. Haz clic en Volver a traducir con IA para generar traducciones automáticamente o edita manualmente el texto traducido.

3. Comprueba la vista previa, que se actualiza en tiempo real a la derecha.

El widget se muestra automáticamente en el idioma correspondiente cuando los visitantes navegan por tu centro de ayuda traducido.

Desarrollado por

Activa o desactiva el enlace "Desarrollado por Ferndesk" en el pie de página del widget.

Instalar

Copia el fragmento de código de inserción y pégalo en el HTML de tu sitio antes de la etiqueta de cierre </body>. El fragmento incluye el ID único de tu widget y carga el widget automáticamente. Cada widget tiene su propio fragmento de código e ID de widget, por lo que puedes instalar widgets diferentes en sitios o aplicaciones diferentes.

Artículos relacionados

• Insertar el widget de autoservicio

• Descripción general del widget de autoservicio

• Qué es el asistente de IA

• Referencia del SDK de Ferndesk

• Cómo personalizar tu centro de ayuda