Aprende en este tutorial cómo crear variaciones del bloque de galería por defecto con un poco de código.
Ya sabes que soy muy partidario de sacarle partido al editor de bloques, especialmente extendiendo sus posibilidades nativas.
En un tutorial anterior te conté que las variaciones de bloque te permiten personalizar la estructura y añadir/eliminar/modificar los bloques internos (inner blocks).
Pero además de crear nuevas variaciones también puedes crear modificaciones que afecten la versión por defecto de un bloque.
Con un ejemplo lo vas a entender mejor. 😉
El bloque de galería recorta por defecto las imágenes, pero puedes crear una variación para que no lo haga y así evitar tener que cambiar ese ajuste cada vez que añades un nuevo bloque de galería.
Aquí tienes cómo hacerlo.
Pasos para crear una variación del bloque de galería en WordPress
1. Registra una nueva variación de bloque
Lo primero que tienes que hacer es registrar las nuevas variaciones.
Para ello crea un fichero llamado block-variations.js dentro de la carpeta /assets/js/ de tu tema (si no existe puedes crearla) con alguno de los siguientes códigos:
Para ver este código y los otros 1921 snippets de esta web,
identifícate o suscríbete aquí.
En los 3 snippets anteriores la variación contiene los siguientes campos:
core/gallery: el bloque de galería para el que estamos creando la variación.isDefault: al sertrueindicas que sea una variación por defecto.attributes: los atributos del bloque.
En este caso, no son necesarios ni name ni label ya que no estás creando una nueva variación, sino que estás modificando la que viene por defecto.
En los atributos indicas, dependiendo del ejemplo:
imageCrop: si estruerecorta la imagen, si esfalseno.linkTo: indicas que el destino de la imagen (attachment,media,none)sizeSlug: indicas el tamaño de la imagen (thumbnail,medium,large,full).
Puedes ver los atributos determinados que tiene cada bloque en la documentación oficial.
En los 3 ejemplos consigues lo siguiente:
- Que las imágenes no se recorten.
- Que las imágenes están enlazadas al archivo multimedia (ideal su usas un plugin de lightbox y quieres asegurarte de que funcione en galerías).
- Las dos anteriores, más que el tamaño por defecto de la imagen sea el mediano y que la imagen se abra en una página nueva.
Ya ves que a efectos prácticos la nueva variación que has creado reemplaza al bloque nativo, con los nuevos ajustes.
2. Encola las nuevas variaciones de bloques
Una vez que tienes el fichero donde has registrado los estilos, debes encolarlos al tema. Para ello añade el siguiente snippet al final de functions.php:
Para ver este código y los otros 1921 snippets de esta web,
identifícate o suscríbete aquí.
Ya ves que tampoco es un proceso muy complicado y puede dar mucho juego.
Esto es un simple ejemplo en que te puedes inspirar para crear tus propias variaciones por defecto de bloques.
Conclusiones
El editor de bloques de WordPress permite muchas posibilidades de personalización. Si quieres sacarle partido al máximo, personalizar los ajustes de un bloque creando una variaciones de la versión por defecto es una buena manera de hacerlo y ahora ya sabes cómo.
Si tienes alguna duda te leo en los comentarios. Y si quieres dejarme una sugerencia para futuros tutoriales, envíamela a través del formulario de contacto.
Todo ventajas de ser suscriptor. 😉
