Sácale partido los bloques reutilizables

El editor de bloques de WordPress no sólo nos permite editar y maquetar el contenido más fácilmente, sino además, con los bloques reutilizables podemos ganar mucho tiempo.


por

Aunque a muchos de nosotros nos costó acostumbrarnos, hoy en día el editor de bloques se ha convertido en una comodidad de la que ahora nos sería difícil prescindir.

Una de las características que incorpora y a la que cada vez le estoy sacando más partido, tanto como usuaria como desarrolladora, es el uso de los bloques reutilizables.

Los bloques reutilizables son aquellos que WordPress nos permite guardar para poder utilizar en cualquier otro post o página de nuestra web tal y como lo tenemos maquetado.

Puede ser desde un simple párrafo, con un texto que podemos querer utilizar en varios sitios, como un grupo de bloques maquetado y con los estilos preparados para no tener que volver a repetirlo desde cero otra vez.

La gran ventaja, además de ganar tiempo añadiendo contenido con un diseño específico en varios sitios, es que quedan vinculados, de forma que si modificamos el bloque original, éste se modifica en todos aquellos sitios en los que se utiliza.

Si tienes un blog, por ejemplo, esto es muy cómodo para poder añadir, por ejemplo, CTA’s o banners, y cambiarlo en un momento desde un único sitio.

Crear un bloque reutilizable

Para guardar un bloque cómo reutilizable, simplemente has de seleccionarlo una vez lo tengas listo, y en las opciones indicar ‘Añadir a los bloques reutilizables’

Y una vez creado, para usarlo, sólo has de seleccionarlo en el apartado ‘Bloques reutilizables’ en el listado de bloques disponibles:

bloques reutilizables

Además, podrás ver todos los que tienes creados y editarlos, desde el enlace que aparece debajo de los bloques disponibles ‘Gestionar todos los bloques reutilizables’ o si vas a trabajar mucho con ellos y te es más cómodo, puedes utilizar el siguiente código para añadir una opción en el menú para acceder:

/**
 * Reusable Blocks accessible in backend
 * @link https://www.billerickson.net/reusable-blocks-accessible-in-wordpress-admin-area
 *
 */
function be_reusable_blocks_admin_menu() {
    add_menu_page( 'Reusable Blocks', 'Reusable Blocks', 'edit_posts', 'edit.php?post_type=wp_block', '', 'dashicons-editor-table', 22 );
}
add_action( 'admin_menu', 'be_reusable_blocks_admin_menu' );

Ten en cuenta que cuando editas y modificas un bloque, se modificará igual en todos sitios, por lo que si sólo quieres cambiarlo en una página o post en concreto sin modificar el original, puedes convertirlo a bloque normal y cambiarlo sin problemas:

Importar y exportar bloques reutilizables

Si como editor o autor en un blog o web te pueden ser útiles los bloques reutilizables, si eres implementador o desarrollador WordPress, todavía le puedes sacar más partido con las opciones de importar y exportar bloques reutilizables.

Hay tipos de contenido, que aunque el texto o colores puedan ser diferentes, la estructura básica te puede servir entre diferentes páginas web, y es una ventaja no tener que partir desde cero para usarla en otros sitios.

Para ello, desde el gestor de los bloques reutilizables tenemos la opción de importarlos y exportarlos como json:

De esta forma, puedes tener tu bliblioteca de bloques básicos, que luego adaptarás al estilo de cada web, ganando mucho tiempo.

Si utilizas EditorsKit, del que habábamos hace unos días, también tienes opción de exportar e importar los bloques sin necesidad de guardarlos como reutilizables, desde el mismo menú de opciones del bloque.

A tener en cuenta al importar / exportar bloques

  • Si el bloque utiliza imágenes, se guardará la url original, por lo que si lo utilizamos en otra web, estará llamando a la imagen en el dominio desde donde exportaste el bloque.
  • Si estás utilizando plugins de bloques adicionales, en la web de destino debes tenerlo también para que coja los estilos y funcionalidad necesaria.
  • Ojo si en el bloque tienes clases de CSS añadidas, porque deberás crearlas también en el nuevo sitio.

Y si estás empezando a trastear con el editor y quieres ver todas las opciones que tienes y plugins con bloques extra que puedes probar, mírate este post de Celi Garoe: Manual de Gutenberg para dummies

Y no te pierdas esta charla en WordPress.tv de José Ángel Vidania sobre los plugins para Gutenberg

¿Eres implementador o desarrollador WordPress?

En la Zona DPW encontrarás más recursos, tutoriales, plantillas, y una biblioteca de snippets para poder utilizar en tu día a día y ganar tiempo en tu trabajo:

ACCEDER AHORA