Un formulario de Lightbox es una excelente manera de recopilar información de los visitantes de tu sitio web sin obligarlos a abandonar la página en la que se encuentran. Cuando alguien hace clic en un botón o enlace, el formulario aparece en la pantalla, facilitando su llenado en ese momento.
Con Jotform, crear un formulario de Lightbox es fácil y rápido. Es una gran herramienta para formularios de contacto, encuestas y más, ayudándote a obtener más respuestas y mantener el interés de los visitantes.
Obtener los códigos de inserción para Lightbox
Para obtener los códigos de inserción para Lightbox
- En el Creador de Formularios, navega a la pestaña Publicar en la parte superior de la página.
- Selecciona Insertar en el panel izquierdo.
- Elige y haz clic en la opción Lightbox.
- En la página siguiente, puedes copiar el código haciendo clic en el botón verde de Copiar código. O, presiona el botón de Vista previa para ver cómo se ve.
Cuando haces clic en el botón de Vista previa, así es como se ve:
Personalizar el Lightbox
Si deseas personalizar la apariencia del Lightbox, haz clic en el botón de Personalizar como se muestra en la captura de pantalla anterior. En la sección de personalización, puedes cambiar el título del Lightbox, redimensionar el formulario y actualizar estilos y colores para que coincidan con el diseño de tu sitio. También puedes seleccionar si deseas que el Lightbox se abra automáticamente cuando los visitantes cargan la página, dándote control total sobre cómo interactúa con tus usuarios.
No olvides hacer clic en el botón de Guardar cambios, luego copia el código generado.
Personalizando la llamada a la acción para usar una imagen
Si deseas usar una imagen en lugar de un botón/enlace para activar la apertura del lightbox, debes reemplazar la siguiente línea:
<a class="btn lightbox-{formID}" style="margin-top: 16px">
{form_title}
</a>…con lo siguiente:
<img src="{imageURL}" class="btn lightbox-{formID}">Para asegurarte de que tu formulario de Lightbox funcione correctamente, tendrás que reemplazar los marcadores de posición en el código. Para {formID}, usa el ID del Formulario real — este es la cadena de números que se encuentra al final de la URL de tu formulario. De manera similar, para {imageURL}, reemplázalo con la URL de la imagen real que deseas mostrar.
También es importante mantener el valor del atributo de clase exactamente como está. Este valor garantiza que el Lightbox se abrirá correctamente cuando los visitantes hagan clic en la imagen.
Enviar Comentario: