web_modal Shortcode
El shortcode web_modal muestra el componente modal.
Los atributos siguientes coinciden con los controles actuales del Page Builder y con la salida pública. Utiliza la sintaxis sin procesar solo para contenido revisado que no pueda mantenerse mediante los controles visuales.
Shortcodes secundarios permitidos: web_modal_content.
Uso
[web_modal]
Content
[/web_modal]Atributos
| Atributo | Predeterminado | Valores aceptados | Propósito |
|---|---|---|---|
modal_title |
— | Cadena, salvo indicación contraria | Título que se muestra en la parte superior del modal. |
modal_aria_label |
— | Cadena, salvo indicación contraria | Añade una etiqueta ARIA para la accesibilidad . |
modal_button_text |
— | Cadena, salvo indicación contraria | Añade texto al botón. |
modal_width |
large |
small, large, extra_large |
Elige la anchura del modal. |
modal_background_url |
— | Cadena, salvo indicación contraria | Controla el fondo del modal. |
modal_background |
— | Cadena, salvo indicación contraria | Selecciona la imagen de fondo. |
popup_hide_button |
— | yes |
Si está seleccionado, no habrá botón para abrir el modal. |
button_style |
1 |
1 o un slug de estilo de botón configurado |
Elige un estilo de botón definido en el sistema de diseño de POM. |
popup_on_page_load |
— | yes |
Si está seleccionado, el modal se abrirá al cargar la página. |
popup_on_page_load_time |
— | Entero en milisegundos, 0–86400000 | Retardo antes de la apertura automática. Disponible cuando popup_on_page_load es yes. |
popup_open_only_once |
— | yes |
Recuerda cualquier cierre correcto de este ID de modal en este navegador y evita su reapertura automática. Otros modales y activadores manuales siguen disponibles. Las restricciones del almacenamiento del navegador o el borrado de datos del sitio pueden restablecer el estado recordado. |
popup_open_if_tab_change |
— | yes |
La ventana emergente se abre después de que el visitante abandone esta pestaña del navegador y vuelva a ella. |
dont_close_when_clicking_outside |
— | yes |
Desactiva el cierre tanto por clic fuera como por tecla Escape. El botón de cerrar sigue disponible. |
schedule_start_date |
— | YYYY-MM-DD |
Primera fecha inclusiva del calendario local para la apertura automática; puede utilizarse sin fecha de fin. |
schedule_end_date |
— | YYYY-MM-DD |
Última fecha inclusiva del calendario local para la apertura automática; puede utilizarse sin fecha de inicio. |
device_visibility |
— | Cadena, salvo indicación contraria | Aplica la regla de visibilidad responsiva seleccionada. |
el_id |
— | ID HTML único y válido | Introduce el ID del elemento (Nota: asegúrate de que sea único y válido según la especificación w3c). |
el_class |
— | Cadena, salvo indicación contraria | Si deseas aplicar un estilo diferente a un elemento de contenido concreto, utiliza este campo para añadir un nombre de clase y haz referencia a él en tu archivo css. |
Contenido incluido
El contenido entre las etiquetas de apertura y cierre se procesa como contenido de shortcode de WordPress. Conserva la estructura padre/hijo que muestra el constructor visual para que los componentes anidados reciban el contexto que esperan.
Cada sección web_modal_content directa se conserva en orden. Un ID ausente recibe un ID automático, pero utiliza un el_id explícito estable para activadores externos y cierres recordados. Las fechas utilizan el calendario local del visitante y solo afectan a la apertura automática; no son reglas de control de acceso. Las fechas no válidas o invertidas impiden la apertura automática. Los activadores manuales siguen funcionando.
Comportamiento de carga
El renderizado del shortcode encola condicionalmente la hoja de estilos compartida del modal, el comportamiento de Bootstrap y el controlador del shortcode en el documento inicial. Las páginas sin modal no solicitan esos archivos. Por tanto, las opciones automática, con retardo, programada, de retorno a la pestaña y de apertura una sola vez quedan preparadas sin esperar una interacción del visitante.
El comportamiento es compatible con páginas cacheadas con sesión cerrada y con páginas dinámicas con sesión iniciada. Los desarrolladores que añadan integraciones de modal personalizadas deben seguir la guía de entrega condicional de recursos y utilizar la función o los identificadores registrados del modal.
El controlador compartido mantiene abierto un solo diálogo a la vez, atrapa el foco del teclado y lo devuelve al activador de la página. No permite que la apertura automática interrumpa otro diálogo abierto. La familia de Modal de Gutenberg utiliza el mismo comportamiento y los mismos recursos.
Verificación
Rellena web_modal con web_modal_content y confirma que cada elemento secundario siga siendo accesible en el orden previsto. Abre, cierra y vuelve a abrir el modal; prueba el foco del teclado y la tecla Escape; y verifica cualquier retardo automático u opción de apertura una sola vez en una sesión con la sesión cerrada. Presta especial atención a modal_title y modal_aria_label.