Cómo crear una cuadrícula de categorías con iconos y entradas destacadas

Wasabi Theme permite la creación de grids o cuadrículas de categorías (algunos usuarios lo llaman cluster de categorías). Para hacerlo, solo tienes que:

  1. Crear o editar una entrada o página
  2. Insertar un bloque Gutenberg de Wasabi llamado “Cuadrícula de categorías”

Opciones del bloque

Seleccionando el bloque y abriendo los ajustes en la barra lateral del editor de entradas o páginas, podrías observar los ajustes del bloque de cuadrícula de categorías:

¿Qué quiere decir cada ajuste?

  • Incluir entradas destacadas: lista debajo del título de la categoría las entradas marcadas como destacadas.
  • Excluir subcategorías: si marcamos esta opción, no se listarán las categorías que cuelguen (subcategorías) de la categoría principal de la entrada o página donde hayamos insertado el bloque.
  • Mostrar sólo categorías hermanas: marcando esta opción, solo mostraremos las categorías hermanas de la categoría principal de la entrada o página donde hayamos insertado el bloque. Una categoría hermana es una categoría que está al mismo nivel (es decir, que comparte categoría madre o superior) con la categoría principal de la entrada o página que contiene el bloque.
  • Mostrar sólo subcategorías: si marcamos esta opción, listaremos única y exclusivamente las categorías que cuelguen (subcategorías) de la categoría principal de la entrada o página donde hayamos insertado el bloque.
  • Criterio de ordenación: cambia el criterio por el que se ordenan las categorías dentro de la cuadrícula.
  • Dirección de ordenación: cambia el orden ascendente o descendente de la ordenación.

Ejemplo

En la imagen anterior se ilustra un ejempo de jerarquía de categorías y entradas de un sitio. Si añadimos el bloque de cuadrícula de categorías en la “Entrada 1”:

  • La categoría principal es la “Categoría 1”
  • Las subcategorías son “Categoría 4”, “Categoría 5” y “Categoría 6”
  • Las categorías hermanas son: “Categoría 2” y “Categoría 3”, porque están en el mismo nivel que la categoría principal.

Por defecto, el bloque mostrará todas las categorías, desde la 1 hasta la 6:

  • Si marcamos “Excluir subcategorías”, solo se listarán 1, 2 y 3.
  • Si marcamos “Mostrar sólo categorías hermanas”, solo se listarán 2 y 3.
  • Si marcamos “Mostrar sólo subcategorías”, solo se listarán 4, 5 y 6.

Las tres opciones son combinables, pero no tendría sentido marcar “Excluir subcategorías” y “Mostrar sólo subcategorías”, ya que no se mostraría nada.

Cómo excluir categorías concretas

Para hacer que una categoría concreta no aparezca en el bloque, tienes que:

  1. Entrar a la página de edición de la categoría
  2. Marcar la casilla de “Exclude from categories grid block” o “Excluir del bloque de cuadrícula de categorías”.
  3. Guardar los cambios.

Cómo centrar las categorías

El bloque está pensado para formar 4 columnas adaptativas (que ocupen el total del ancho de la pantalla). Si tienes menos de 4 categorías, es probable que quieras centrarlo, para ello tienes que:

  1. Entrar a las opciones de edición de CSS personalizado en Apariencia -> Personalizar -> Apariencia -> CSS adicional
  2. Añadir este código (no sustituyas nada de lo que tienes, solo añádelo al final del todo).
article .categories-grid {
    justify-content: center;
}

Vídeo ilustrativo

No muestra todas las opciones, ya que corresponde a una versión muy antigua.



Otro tipo de contenido en el blog de Wasabi