> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.icommkt.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# ¿Cómo crear un modal de tipo encuesta desde Sitios?

El **modal de tipo encuesta** permite mostrar una encuesta del módulo de **Encuestas** directamente en tu sitio web, como pop-up o insertada dentro de la página. Tus visitantes responden sin salir de la navegación y sin abrir enlaces externos.

###### Beneficios
* **Más respuestas:** la encuesta aparece en el momento y el lugar que definas, mientras el usuario navega.
* **Configuración en un solo lugar:** diseño, disparador, páginas y calendario se configuran igual que en el resto de los modales.
* **Reutilización:** una misma encuesta publicada puede mostrarse en distintos modales o sitios.
* **Vista previa interactiva:** puedes recorrer la encuesta completa desde el editor antes de publicarla.

###### Casos de uso
Puedes utilizar los modales de tipo encuesta para conocer mejor a tus visitantes, recoger opiniones y obtener información útil para mejorar su experiencia. Según tu objetivo, puedes mostrar la encuesta como un pop-up mientras navegan por tu sitio o embeberla directamente en una página.
Algunos ejemplos de aplicación son:
* **Moda y tiendas online:** conocer la opinión de quienes compraron recientemente, consultar por qué abandonaron el carrito, identificar preferencias de productos o relevar qué categorías les gustaría encontrar en la tienda.
* **Retail y consumo masivo:** medir la satisfacción con la experiencia de compra, consultar sobre la variedad de productos, evaluar promociones o recoger sugerencias para mejorar el servicio.
* **Inmobiliarias:** conocer qué tipo de propiedad buscan los visitantes, identificar sus preferencias de ubicación y presupuesto, o consultar qué información necesitan para avanzar en una operación.
* **Concesionarias de autos:** relevar qué modelos interesan a los visitantes, conocer sus preferencias de financiación, consultar si desean coordinar una prueba de manejo o identificar qué información necesitan antes de comprar un vehículo.
* **Industria farmacéutica:** conocer la experiencia de navegación en sitios informativos, identificar qué contenidos o recursos de salud resultan de mayor interés y recoger sugerencias sobre la información disponible.
* **Cursos y formación:** consultar qué temáticas interesan a los visitantes, conocer sus objetivos de aprendizaje, identificar qué modalidad prefieren (online o presencial) o relevar qué les impide inscribirse.
* **Experiencias, eventos y talleres:** conocer los intereses de los visitantes, consultar qué actividades les gustaría realizar, evaluar horarios y formatos preferidos o recoger opiniones después de una experiencia.

## Requisitos previos
Para que la encuesta se vea en tu sitio, antes de crear el modal necesitas contar con:
1. **Un Sitio creado** en el módulo de Sitios. Consulta la [Guía general del módulo Sitios](https://help.icommkt.com/es/article/guia-general-del-modulo-sitios-1soksbm/).
2. **El script de Sitios instalado en tu web.** Lo encuentras haciendo clic en **Ver script** dentro de tu Sitio. Para instalarlo, pide a tu equipo técnico que lo inserten en el head de tu web o consulta [Cómo implementar Scripts en Google Tag Manager](https://help.icommkt.com/es/article/guia-como-implementar-scripts-en-google-tag-manager-1hz9239/).
3. **Una encuesta creada y publicada** en el módulo de Encuestas. Solo las encuestas publicadas aparecen disponibles para seleccionarlas en el modal. Consulta nuestra [documentación de Encuestas](https://help.icommkt.com/es/category/encuestas-nueva-experiencia-16ei489/).

## Paso 1: Crear el modal
1. Dentro de tu Sitio, en la pestaña **Modales**, haz clic en **Crear modal**.

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_1tqjuot.png =766xauto)

2. Completa el **Nombre** del modal.
3. En **Tipo**, selecciona **Encuesta**.
4. Describe el **Objetivo** del modal.
5. Haz clic en **Crear modal**.
![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_1vixt3k.png =303xauto)

Se abrirá el editor del modal. A la izquierda encontrarás las secciones de configuración y, a la derecha, la vista previa, que puedes alternar entre escritorio y móvil con los íconos de la parte superior.

## Paso 2: Configurar el modal
Las opciones de personalización están organizadas en secciones desplegables, igual que en el resto de los modales de icomm, y aparecen en este orden: Contenido del modal, Encuesta, En caso de éxito, Estilos del modal, Embeber, Disparador y Reglas de visibilidad. Todos los cambios se reflejan al instante en la vista previa.

###### Contenido del modal
* **Título y Texto:** son el encabezado que acompaña a la encuesta (por ejemplo, "Queremos conocer tu opinión"). En cada campo puedes cambiar la tipografía, el tamaño de la fuente y agregar emojis.
* **Color del texto:** define el color según tu identidad de marca.
* **Alineación del texto:** izquierda, centro, derecha o justificado.
* **Botón de cierre:** activa o desactiva la cruz para cerrar el modal.

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_1xzdsg2.png =408xauto)

###### Encuesta
Este paso es exclusivo del modal de tipo encuesta: aquí defines qué encuesta verán tus visitantes.
1. En la sección **Encuesta**, elige el **espacio de trabajo** donde se encuentra tu encuesta: el espacio de trabajo actual, General u otro de tus espacios de trabajo.

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_ytdncd.png =422xauto)

2. Utiliza el campo **Buscar una encuesta publicada** para encontrarla y haz clic sobre ella.

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_1sivxlb.png)
3. La encuesta quedará seleccionada con su nombre y URL. Si quieres elegir otra, haz clic en **Cambiar**.
4. Revisa la encuesta en la vista previa: puedes recorrer todas sus preguntas. Verás el aviso *"Estás viendo esta encuesta en modo vista previa. Tus respuestas no se guardarán"*, por lo que puedes probarla sin generar respuestas reales.

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_akbap7.png =944xauto)
|| **Importante:** para saber quién respondió la encuesta, agrega en la configuración de la encuesta un **campo oculto** con la clave `icomm_uid`. Sin este campo la encuesta funciona igual, pero las respuestas quedan anónimas.

###### En caso de éxito
Define qué ocurre cuando el usuario termina de responder la encuesta. En **Acción** puedes elegir:
* **Mostrar mensaje:** muestra un mensaje de agradecimiento.
* **Cerrar modal:** el modal se cierra automáticamente.
* **No hacer nada:** el modal queda abierto y la encuesta muestra su pantalla de despedida, la que se configura en el módulo de Encuestas.

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_6bwm7q.png =382xauto)


Si eliges **Mostrar mensaje**, puedes configurar:
* **Título y Texto** del mensaje (por ejemplo, "¡Gracias por responder!"), con su alineación.

  ![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_19ngv3e.png =470xauto)
* **Botón de confirmación:** actívalo para agregar un botón y personaliza su texto, color de fondo, color del texto, borde (color, estilo, grosor y radio) y alineación.

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_ogwsr8.png =400xauto)

###### Estilos del modal
* **Ancho:** Auto, Pantalla completa o Personalizado (en píxeles).
* **Alto:** Auto o personalizado.
* **Márgenes:** superior, inferior, izquierdo y derecho.
* **Color de fondo** y **Radio del borde.**
![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_c7rz6y.png =418xauto)

* **Imagen:** con **Cargar imagen** puedes subir una imagen nueva, elegir una de tu biblioteca (**Buscar en mi biblioteca**) o crearla con **Generar con AI**.
* **Posición del modal:** elige una de las 9 ubicaciones de la grilla y define la distancia a los bordes con los campos **Alejar del borde**.

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_498q50.png)

* **Sombra:** agrega sombra al modal.
* **Bloqueo de página:** impide que el usuario interactúe con la página mientras el modal está visible.
* **Cerrar modal al hacer click en el fondo:** permite cerrar el modal haciendo clic fuera de él.

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_j8kqln.png =556xauto)

###### Embeber (opcional)
Activa la opción **"Insertar el modal dentro de un elemento de la página en lugar de abrirlo encima"** para que la encuesta forme parte del contenido de la página, en lugar de aparecer como pop-up.

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_4c5kri.png =432xauto)
Para definir en qué parte de la página se mostrará el modal embebido, icomm cuenta con la herramienta **Elegir desde el sitio**, que permite seleccionar visualmente el elemento de la página donde se insertará el modal. Al hacer clic en el botón, se abre tu sitio web real y solo necesitas seleccionar el lugar deseado: icomm identifica automáticamente el selector correspondiente.

1. Dentro de la sección **Embeber**, haz clic en **Elegir desde el sitio**, ubicado debajo del campo **Selector**.
2. Se abrirá el sitio web donde se insertará el modal. En la parte inferior de la pantalla aparecerá el panel **Elegir ubicación del modal**, que permanece visible en la misma posición mientras recorres la página.
3. El panel muestra activo el **Modo: Selección**. Al desplazar el cursor sobre la página, cada elemento se resalta con un borde celeste, lo que te permite identificar qué bloque vas a seleccionar antes de hacer clic.
4. Haz clic sobre el elemento deseado. icomm detecta automáticamente su selector y lo muestra en el panel, sin necesidad de escribirlo manualmente.
5. Si es necesario, ajusta la selección:
   * Si el elemento seleccionado no es exactamente el buscado, usa las flechas ▲ ▼ junto al selector para desplazarte entre el elemento "padre" y sus elementos "hijos" dentro de la estructura de la página, sin volver a hacer clic sobre el sitio.
   * Para descartar la selección actual y elegir otro elemento, utiliza el botón **Reiniciar selección**.
6. Define dónde se insertará el modal en relación con el elemento seleccionado, mediante el desplegable **Posición**:
| Opción | Qué hace |
| ---- | ---- |
| Insertar y reemplazar | El modal reemplaza por completo al elemento seleccionado. |
| Insertar como último elemento | El modal se inserta dentro del elemento seleccionado, como su último elemento hijo. |
| Insertar como primer elemento | El modal se inserta dentro del elemento seleccionado, como su primer elemento hijo. |
| Insertar antes | El modal se inserta inmediatamente antes del elemento seleccionado, al mismo nivel jerárquico. |
| Insertar después | El modal se inserta inmediatamente después del elemento seleccionado, al mismo nivel jerárquico. |
7. Una vez definidos el elemento y la posición, haz clic en **Guardar selección** para confirmar. Para descartar los cambios y cerrar el panel sin guardar, haz clic en **Cancelar**.
8. Al guardar, vuelves automáticamente al editor del modal. Los campos **Selector** y **Posición** quedarán completados con la información elegida y podrás ver el resultado en la vista previa, a la derecha del editor.

###### Disparador
Define cuándo aparece el modal. En **Tipo de disparador** puedes elegir entre: **Tiempo de espera**, **Abandono de ventana**, **Click**, **Observar**, **Evento** y **Después de otro modal**. Si eliges Tiempo de espera, indica los segundos que deben pasar antes de mostrar la encuesta.

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_66nvwm.png =462xauto)

Con la opción **Reiniciar** activada, defines cuánto tiempo debe pasar (por ejemplo, 6 días) para que el modal vuelva a mostrarse a un mismo usuario.
![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_c7gco0.png)

| Para usar el disparador Click, consulta [Cómo vincular un botón al disparador click en un pop-up.](https://help.icommkt.com/es/article/como-vincular-un-boton-al-disparador-click-en-un-pop-up-1pno5l/)

###### Reglas de visibilidad
En **Mostrar en** defines en qué páginas aparece el modal:

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_18vadw3.png =404xauto)

* **Todas las páginas:** el evento se dispara en todas las páginas
* **Páginas específicas:** solo en las páginas que indiques.
* **Todas las páginas, excepto…:** en todas las páginas menos las que indiques.
En las dos últimas opciones puedes usar asteriscos para un filtro más avanzado. Por ejemplo, `https://midominio.com/productos*` aplica a las páginas que comienzan con "productos", `*carrito` a las que terminan con "carrito" y `*checkout*` a cualquier URL que contenga "checkout".

En **Cuándo mostrar** defines el período de visualización:
![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_bf31g3.png =322xauto)
* **Siempre:** el modal se muestra sin restricciones de fecha ni horario.
* **Personalizado:** combina un rango de fechas (**Desde** / **Hasta**, opcional), todos los días o **días específicos de la semana**, y todo el día o **ventanas horarias**.

## Paso 3: Guardar, publicar y activar el modal

|| **Importante:** para que la encuesta se vea en tu sitio, el modal debe estar **guardado**, **publicado** y **activo**, y el script de Sitios debe estar instalado en tu web. Si falta cualquiera de estos pasos, la encuesta no se mostrará.

Antes de finalizar, puedes usar el botón **Vista previa** para revisar el diseño y el funcionamiento del modal.

###### 1. Guardar
Haz clic en **Guardar**. Los cambios se guardan como **borrador**: verás el mensaje *"Cambios guardados. No se ven en el sitio hasta que publiques"* y la etiqueta **Cambios sin publicar** junto al nombre del modal.
Guardar te permite editar el modal sin modificar la versión que se muestra en tu sitio: tus visitantes seguirán viendo la última versión publicada.

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_1msudq6.png =724xauto)

###### 2. Publicar
Haz clic en **Publicar** para que la configuración del borrador se aplique en tu sitio. Verás el mensaje *"Publicado como versión X. Ya se ve en el sitio"* y la etiqueta de versión se actualizará (por ejemplo, **Versión 2 publicada**). Cada publicación genera una nueva versión en el historial.

![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_1mbqvj9.png =736xauto)

###### 3. Activar
Aunque el mensaje de publicación indique que el modal ya se ve en el sitio, un modal recién creado queda en estado **Inactivo** y no se mostrará a tus visitantes hasta que lo actives.
1. Haz clic en el desplegable de estado **Inactivo**, junto al nombre del modal.
2. Selecciona **Activar**.
![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_1bn2l68.png =653xauto)
3. Verás el mensaje *"Estado cambiado con éxito"* y el estado pasará a **Activo**.
![](https://storage.crisp.chat/users/helpdesk/website/-/e/4/b/4/e4b41ef8ae96c800/image_vpt2lc.png =654xauto)

También puedes activar o desactivar el modal desde la pantalla principal de Sitios, en la pestaña **Modales**.

### Checklist final
Verifica que se cumplan todas estas condiciones para que la encuesta se vea en tu sitio:
* La encuesta está publicada en el módulo de Encuestas.
* El script de Sitios está instalado en tu web.
* El modal está guardado y publicado.
* El modal está en estado **Activo**.

> **Tip:** si más adelante modificas el modal, recuerda que guardar no publica los cambios. Para que se vean en tu sitio, debes hacer clic en **Publicar** nuevamente. Si necesitas recuperar una configuración anterior, consulta la sección de historial de versiones desde el desplegable que indica la versión publicada.

## Artículos relacionados
* [Guía general del módulo Sitios](https://help.icommkt.com/es/article/guia-general-del-modulo-sitios-1soksbm/)
* [Cómo crear el Pop Up de Suscripción desde Sitios](https://help.icommkt.com/es/article/como-crear-el-pop-up-de-suscripcion-desde-sitios-1e190y5/)
* [Cómo implementar Scripts en Google Tag Manager](https://help.icommkt.com/es/article/guia-como-implementar-scripts-en-google-tag-manager-1hz9239/)
* [Cómo vincular un botón al disparador click en un pop-up](https://help.icommkt.com/es/article/como-vincular-un-boton-al-disparador-click-en-un-pop-up-1pno5l/)
* [Documentación del módulo de Encuestas](https://help.icommkt.com/es/category/encuestas-nueva-experiencia-16ei489/)