Insertar un quiz en tu web – código universal
Insertar un quiz de AdsQuiz en tu web
En esta guía veremos cómo usar un quiz de AdsQuiz como parte completa de tu web – no solo como un formulario estándar, sino como widget, pop-up o bloque interactivo en distintas páginas.
Hoy un quiz se puede añadir a una web en distintos formatos, según tus objetivos. Puede funcionar como una página completa para segmentar a la audiencia o como un elemento de la interfaz que ayuda a captar solicitudes.
Puedes colocar el quiz en distintas partes de tu web:
• como bloque en una página;
• como pop-up;
• como formulario de chat;
• como panel lateral;
• como sugerencia interactiva o botón de inicio.
También hay distintos activadores de visualización:
• tras cierto tiempo en la web;
• al hacer clic en un botón;
• cuando el visitante intenta salir de la página (exit intent);
• automáticamente al cargar la página.
Así ajustas con precisión el comportamiento del quiz y aumentas la conversión en cada escenario.
Configurar la inserción del quiz
Paso 1. Para instalar el quiz en tu web, ve a los ajustes del quiz y abre la sección «Instalar el quiz en la web».
Después:
- Introduce el dominio donde se colocará el quiz.
- Elige el formato de visualización (bloque, pop-up, widget, etc.).
- Define el tamaño del quiz o usa una de las opciones listas.
- Si lo necesitas, define tus propios parámetros de visualización a mano.
- Elige los dispositivos (ordenador, móvil o todos).
También puedes personalizar el aspecto:
• colores de los botones;
• colores de los iconos;
• estilos de los elementos de la interfaz.
💡 Consejo: usa los ajustes de apariencia – te permiten adaptar el quiz por completo al diseño de tu web.
Paso 2. Generar e insertar el código
Cuando lo tengas todo configurado, haz clic en «Generar código» – el sistema creará un script para insertar.
Pégalo en el bloque o sección correspondiente de la plantilla de tu web.
Paso 3. Comprobar que funciona
Después de publicar, comprueba:
• cómo se ve en ordenador y en móvil;
• que funcionan los activadores (clic, tiempo, exit intent);
• que las solicitudes se recogen correctamente.
⚠️ Importante:Antes de insertarlo, asegúrate de que el dominio está añadido en los ajustes de AdsQuiz.
🧩 WordPress
Cómo insertar el quiz
• abre el panel de administración de WordPress
• ve a la página o entrada que necesites
• añade un bloque «Código» o Custom HTML
• pega el script JS
• guarda y publica
🛒 Shopify
Cómo insertar el quiz
• abre el panel de administración de Shopify
• ve a Online Store → Themes → Edit code
• abre la plantilla que necesites (producto, página o theme.liquid)
• pega el script antes de </body> o en el bloque que necesites
• guarda los cambios
🎯 Wix
Cómo insertar el quiz
• abre el editor de Wix
• haz clic en Add → Embed → Custom Embeds
• elige HTML iframe / Embed Code
• pega el script de AdsQuiz
• coloca el bloque en la página
• publica el sitio
🧩 Webflow
Cómo insertar el quiz
• abre tu proyecto en Webflow
• ve a Page Settings o Project Settings
• busca la sección Custom Code
• pega el script en Before tag
• guarda y publica el sitio
⚡ Lovable
Cómo insertar el quiz
• abre el editor de Lovable
• ve a la sección de código personalizado o integraciones
• pega el script JS de AdsQuiz
• guarda los cambios
• publica la página
⚛️ Next.js
Cómo insertar el quiz
• abre tu proyecto de Next.js
• añade el script al componente _app.js o layout.js
• guarda y ejecuta el proyecto
▶️ Vídeo recomendado
Para entender mejor el proceso de configuración, te recomendamos ver la guía en vídeo:
❓ Preguntas frecuentes
¿Puedo insertar un quiz sin código? No. Para insertarlo se usa un script JS generado.
¿El quiz funciona en móviles? Sí, el quiz es responsive y se adapta automáticamente a móvil y ordenador.
¿Puedo usar el quiz como pop-up? Sí. Formatos disponibles: bloque, widget, pop-up, formulario de chat.
¿Puedo añadir el quiz a varios dominios? Sí. En el campo «Dominio» de la sección «Compartir» hay un botón «Añadir dominio» – puedes añadir varias direcciones. Es útil si un mismo quiz se usa a la vez en tu web principal y en micro-landings.