web_infography_spot Shortcode
El shortcode web_infography_spot renderiza el componente interactivo de punto de infografía (Infography spot).
Los atributos siguientes coinciden con los controles actuales del Page Builder y la salida pública. Utiliza la sintaxis en crudo solo para contenido revisado que no pueda mantenerse mediante los controles visuales.
Shortcodes principales permitidos: web_interactive_infography.
Uso
[web_infography_spot title="Point information"]<p>Describe the point.</p>[/web_infography_spot]Atributos
| Atributo | Predeterminado | Valores aceptados | Propósito |
|---|---|---|---|
spot_mode |
tooltip-mode |
tooltip-mode, link |
Controla el modo del punto. |
spot_action |
url |
url, modal, ajax, slider |
Elige si el punto abre una URL, una ventana modal, una página cargada dinámicamente o una acción del slider. Disponible cuando spot_mode es link. |
spot_url |
— | Cadena salvo que se indique lo contrario | Introduce la URL a la que dirigirás al hacer clic en el botón. Disponible cuando spot_action es url. |
spot_url_target |
— | yes |
Abre el enlace en otra ventana. Disponible cuando spot_action es url. |
spot_modal_id |
— | Cadena salvo que se indique lo contrario | Introduce el ID de la caja modal que se activará al hacer clic en el botón. Disponible cuando spot_action es modal. |
spot_ajax_page |
— | Un valor seleccionado desde WordPress | Elige la página que se mostrará mediante AJAX. Disponible cuando spot_action es ajax. |
spot_slider_id |
— | Cadena salvo que se indique lo contrario | Introduce el ID del Slider que quieres gestionar. Disponible cuando spot_action es slider. |
spot_slider_action |
next |
next, previous, custom |
Controla la acción del slider. Disponible cuando spot_action es slider. |
spot_slider_custom_slide_id |
— | Cadena salvo que se indique lo contrario | Controla el ID personalizado de la diapositiva. Disponible cuando spot_slider_action es custom. |
aria_label |
— | Cadena salvo que se indique lo contrario | Establece la etiqueta para la accesibilidad. |
title |
— | Cadena salvo que se indique lo contrario | Título para el tooltip. Disponible cuando spot_mode es tooltip-mode. |
icontype |
dot |
dot, number, image |
Controla la visualización del hotspot con:. |
hotspot_image |
— | Cadena salvo que se indique lo contrario | Selecciona la imagen que se mostrará. Disponible cuando icontype es image. |
position_y |
25% |
Cadena salvo que se indique lo contrario | Controla la posición y del icono. |
position_x |
25% |
Cadena salvo que se indique lo contrario | Controla la posición x del icono. |
color |
1 |
Ranura de paleta numérica 1–15 | Utiliza el helper de color de fondo del tema. |
ispulse |
yes |
yes, no |
Controla la animación de pulso mostrada para el icono del hotspot?. |
arrowposition |
top |
top, right, bottom, left |
Posición preferida del tooltip, disponible en tooltip-mode. |
el_class |
— | Cadena salvo que se indique lo contrario | Si deseas dar un estilo diferente a un elemento de contenido concreto, utiliza este campo para añadir un nombre de clase y luego haz referencia a él en tu archivo css. |
index |
Derivado por el principal | Entero basado en cero | El principal asigna el orden entre todos los puntos. Los marcadores numéricos muestran índice + 1. |
El contenido encerrado proporciona HTML seguro para el tooltip. Las acciones de URL admiten enlaces HTTP(S), de correo y de teléfono ordinarios; las pestañas nuevas usan atributos de relación seguros. Los destinos de acción ausentes o no válidos permanecen inactivos. Los destinos AJAX deben ser visibles públicamente y no requerir contraseña; su enlace permanente se resuelve en el momento de la renderización. Los IDs de Modal y Slider deben identificar elementos de la misma página.
Las coordenadas utilizan la esquina superior izquierda del marcador. Los valores heredados seguros existentes en porcentaje, píxeles y longitudes relativas siguen siendo compatibles, incluidos los desplazamientos intencionados más allá de la imagen. Los controles de posicionamiento visual de Gutenberg utilizan 0–100 %. Las imágenes de marcador usan los metadatos actuales de la biblioteca o una URL pública válida de imagen. El movimiento de pulso respeta las preferencias de movimiento reducido.
Verificación
Mantén web_infography_spot dentro de web_interactive_infography; verifica el orden de los elementos secundarios y la interacción del principal en la página pública. Presta especial atención a spot_mode y spot_action.
En dispositivos basados en puntero, un punto en modo tooltip permanece abierto durante un segundo después de que el puntero abandone el punto. Entrar en el tooltip durante ese periodo de gracia lo mantiene abierto. El foco del teclado también lo abre; Escape lo cierra. Los dispositivos orientados a táctil utilizan una interacción de clic persistente. Abrir otro punto o hacer clic fuera descarta el tooltip anterior.