DooBlockPatterns: nuestro plugin para Patrones de Bloques de Gutenberg

Los patrones de bloques son una colección de bloques predefinidos que puedes insertar en entradas y páginas para después personalizarlos con tu propio contenido. Usar un patrón de bloque te permite reducir el tiempo que dedicas a crear contenido para tu sitio. Además, es una buena forma de aprender a combinar diferentes bloques y conseguir efectos más interesantes. Los patrones de bloques pueden ser muy simples o pueden incluso abarcar todo el contenido de una página.

Insertar un patrón de bloques en una página

Para insertar un patrón de bloques haz clic en el icono + para añadir un nuevo bloque y selecciona la pestaña Patrones y selecciona el patrón que se quiera insertar y se introducirá en el lugar donde estaba el cursor.

Una vez que se haya insertado el patrón, este se puede editar como cualquier bloque, incluso cambiar sus propiedades.

Existe una gran variedad de patrones que se pueden buscar con el botón explorar. Además, la comunidad de WordPress sigue creando patrones que junto a diversos plugins pueden ser integrados en tu WordPress.

Crear patrones propios

Para crear patrones de bloques y tenerlos disponible en nuestra instalación de WordPress, podemos realizarlo registrando los patrones mediante código.

Los detalles para registrar patrones los encontrarás en la documentación que describe la función register_block_pattern, que admite los siguientes parámetros:

• title (requerido): título del patrón.
• content (requerido): contenido del patrón.
• description: texto oculto visualmente usado para describir el patrón en el editor. La descripción es opcional, pero se recomienda cuando el título no describe completamente lo que hace el patrón.
• categories: una serie de categorías de patrones utilizadas para agrupar los patrones de bloques. Los patrones de bloques pueden mostrarse en múltiples categorías. Las categorías se pueden registrar con la función register_block_pattern_category.
• keywords: conjunto de alias o palabras clave que ayuden a los usuarios a buscar el patrón.
• viewportWidth: número entero que especifica el ancho del patrón en el editor.

Para ello es necesario acceder al código de WordPress, lo cual, para muchos, es incómodo y dada la tendencia de WordPress al Full Site Editing, se requiere otro sistema para añadir patrones personalizados a las necesidades de los editores.

Otra forma para crear patrones es utilizar un plugin de creación de patrones de bloques. En el repositorio de WordPress existen diversos plugins para realizar esta labor.

Crear patrones utilizando el plugin DooBlockPatterns

En este artículo te proponemos utilizar el plugin DooBlockPatterns. Este plugin se puede descargar e instalar, es gratuito. Una vez instalado, aparecerá en la barra lateral el menú en el que podemos añadir patrones de bloque, categorizarlos e indicar palabras clave que nos permitirán la búsqueda durante la edición. La eliminación de patrones, su modificación o desinstalación del plugin no afecta a los bloques creados con los patrones, ya que una vez insertado el patrón, este no esta vinculado al patrón origen.

En los Ajustes de este plugin podemos indicarle si los datos generados se eliminarán al desinstalar el plugin.

Veamos un ejemplo: podemos crear un patrón muy simple que se llame Sección de contenido, que constará de encabezados y secciones de contenido agrupadas:

Con los siguientes ajustes:

Este patrón ya se puede utilizar en el editor de bloques.