Shortcode web_taxonomy_terms_thumbnails
El shortcode web_taxonomy_terms_thumbnails presenta los términos de una taxonomía seleccionada como una cuadrícula de miniaturas adaptable. Solo están disponibles las taxonomías públicas registradas con URL de archivo públicas, incluidas las taxonomías de producto de WooCommerce compatibles.
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.
Uso
[web_taxonomy_terms_thumbnails]Atributos
| Atributo | Predeterminado | Valores aceptados | Propósito |
|---|---|---|---|
taxonomy |
— | Un slug de taxonomía pública | Selecciona la taxonomía de origen. La misma lista de taxonomías públicas se utiliza en Gutenberg. |
layout |
default |
default, simple |
Selecciona la presentación de la tarjeta. |
top_level_only |
— | yes o vacío |
Limita los resultados jerárquicos a términos sin padre. |
child_of_term_with_id |
— | Un ID de término | Muestra los hijos directos del término padre especificado. |
specific_child_terms |
— | IDs de términos separados por comas | Incluye solo los términos especificados. |
excluded_terms |
— | IDs de términos separados por comas | Excluye los términos especificados. |
number |
-1 |
Entero no negativo; vacío o negativo selecciona todos | Limita ambos diseños. Cero no representa nada; los valores positivos conservan su tamaño creado. El límite de editor independiente del bloque nativo no limita las colecciones Legacy. |
columns |
3 |
12, 6, 4, 3, 2, 1 |
Establece el tramo de cuadrícula en escritorio: 3 significa cuatro tarjetas por fila; 12 significa una. |
columns_tablet |
12 |
12, 6, 4, 3, 2, 1 |
Tramo de cuadrícula a 768–991 px. |
columns_portrait |
Igual que móvil | Tramo de cuadrícula 1–12 |
Tramo de cuadrícula a 576–767 px. |
columns_mobile |
12 |
12, 6, 4, 3, 2, 1 |
Tramo de cuadrícula por debajo de 576 px. |
orderby |
name |
name, slug, term_id, description, parent, term_order, meta_value_num, menu_order |
Selecciona el campo de ordenación. meta_value_num y menu_order utilizan la posición guardada de la categoría. |
order |
DESC |
ASC, DESC |
Controla el orden. |
display_thumbnail |
yes |
yes, no o vacío |
Controla la miniatura de visualización. |
image_size |
thumbnail |
Cualquier slug de tamaño de imagen registrado en WordPress | Selecciona el tamaño de miniatura de término generado. |
display_background_image |
yes |
yes, no o vacío |
Controla la imagen de fondo de visualización. |
background_image_size |
full |
full o cualquier slug de tamaño de imagen registrado en WordPress |
Selecciona la copia generada utilizada para una imagen de fondo local. Las URL de imágenes externas permanecen sin cambios. |
display_title |
yes |
yes, no o vacío |
Controla el título de visualización. |
display_color |
— | yes, no o vacío |
Controla el color de visualización. |
title_color |
1 |
Ranura de paleta numérica 1–15; 0 hereda |
Elige el color del título. |
title_alignment |
right |
left, right, under, tooltip |
Elige la alineación del título. |
title_size |
h4 |
display-1, display-2, display-3, display-4, h1, h2, h3, h4, h5, h6, o vacío para heredar |
Elige el tamaño del título. |
display_description |
— | yes, no o vacío |
Controla la descripción de visualización. |
description_color |
1 |
Ranura de paleta numérica 1–15; 0 hereda |
Elige el color de la descripción. |
show_empty_terms |
— | yes, no o vacío |
Controla mostrar los términos vacíos. |
link_term_to_archive |
yes |
yes, no o vacío |
Controla enlazar cada término a su archivo. |
display_only_related_to_post |
— | yes, no o vacío |
Controla mostrar solo los términos relacionados con la entrada. |
display_only_related_to_current_category |
— | yes |
Si el módulo está en un archivo de categoría, solo se mostrarán los relacionados con esa categoría. |
device_visibility |
— | Cadena, salvo que se indique lo contrario | Aplica la regla de visibilidad adaptable seleccionada. |
el_id |
— | ID de HTML único válido | Introduce el ID de sección (Nota: asegúrate de que sea único y válido según la especificación w3c). |
el_class |
— | Cadena, salvo que se indique lo contrario | Si deseas dar un estilo diferente a un elemento de contenido en particular, utiliza este campo para añadir un nombre de clase y luego haz referencia a él en tu archivo CSS. |
accessible_name |
— | Texto simple | Etiqueta de colección accesible opcional. |
Filtrado y diseño
El ID de padre explícito tiene prioridad sobre los filtros de archivo actual y de nivel superior. El filtrado por archivo actual requiere un archivo de término real de la taxonomía seleccionada. El filtrado por entrada actual utiliza la entrada singular o del bucle, y se cruza con otros filtros. Las exclusiones también se aplican a los IDs incluidos explícitamente. El filtrado de términos vacíos también incluye a los padres cuyos descendientes contienen contenido publicado.
El diseño Simple muestra nombres y enlaces, anidando los hijos seleccionados bajo los padres seleccionados. Los hijos sin un padre seleccionado aparecen en la raíz. Los ajustes de imagen, texto y color de la tarjeta no se aplican a las listas Simple. Ambos diseños conservan el ID personalizado, las clases auxiliares y la visibilidad por dispositivo.
Las descripciones de las tarjetas son independientes de la visibilidad del título. Las imágenes de tooltip que faltan recurren a los nombres de término visibles; los enlaces solo de imagen conservan nombres accesibles. Los metadatos de las imágenes locales están actualizados en el momento de la representación. Las imágenes de fondo utilizan una capa decorativa de cobertura, y las muestras de color utilizan atributos de color seguros, sin CSS en línea. Las dependencias de tooltip son condicionales a las opciones de tarjeta activas. Los archivos SVG se cargan como imágenes en lugar de inyectarse como marcado sin procesar.
Las tarjetas Legacy conservan los ganchos de selector p-15, p-5 y web-gap-20 junto con sus ayudantes de espaciado actuales, de modo que los estilos personalizados existentes puedan seguir apuntando a estos elementos. Estos ganchos no crean clases de utilidad globales basadas en píxeles.
Ordenación por posición de categoría
Elige Menu order en el control Order by del módulo y ASC en Order para seguir las posiciones guardadas al arrastrar categorías en WordPress. El Page Builder almacena esta elección como orderby="meta_value_num". Las plantillas HTML también pueden utilizar orderby="menu_order" con el mismo resultado:
[web_taxonomy_terms_thumbnails taxonomy="category" orderby="menu_order" order="ASC" top_level_only="yes"]Sustituye category por el slug de tu taxonomía. Utiliza DESC para invertir las posiciones guardadas. Los términos sin posición cuentan como cero. Para las categorías de producto de WooCommerce (product_cat), ambos valores utilizan la ordenación de categorías de WooCommerce. Term order es una opción de WordPress independiente y no selecciona las posiciones de categoría guardadas de POM.
Verificación
Las miniaturas enlazadas utilizan el nombre del término como su nombre accesible, incluidos los archivos de imagen SVG y las cuadrículas con Display title desactivado. Comprueba que cada miniatura anuncie el término correspondiente y abra su archivo en el idioma actual.
Previsualiza la cuadrícula con una taxonomía que tenga imágenes locales, descripciones y términos anidados. Compara Full con un tamaño generado como Medium y confirma que la URL de fondo cambie a la copia seleccionada sin afectar al tamaño de miniatura independiente. Luego verifica la regla de inclusión, exclusión o padre elegida y el número de columnas configurado en anchos de escritorio, tableta y móvil.
Para verificar la ordenación de categorías, guarda posiciones que difieran del orden alfabético y previsualiza el shortcode con orderby="menu_order" order="ASC". Confirma que coincida con Menu order en el Page Builder y, a continuación, utiliza DESC para comprobar el orden inverso.