Cómo controlar los bloques de Gutenberg para publicaciones en WordPress: deshabilitar bloques y plantillas de bloques

El nuevo editor de WordPress, Gutenberg, le da al autor una gran flexibilidad para crear contenido rico. Pero en algunos casos, es posible que deba limitar esto un poco, ya sea como webmaster del sitio o como desarrollador de temas. En esta publicación, veremos cómo podemos proporcionar limitaciones de bloques en Gutenberg usando PHP.

Hay una funcionalidad integrada para establecer algunas limitaciones en bloques con las que muchos aún no están familiarizados. Esto puede ser útil cuando necesita que ciertas publicaciones sigan el mismo diseño o contenido, o si desea ayudar a los autores no técnicos a no sentirse abrumados por la cantidad de bloques en Gutenberg. Otro ejemplo incluye agregar automáticamente los bloques de anuncios necesarios (si tiene un complemento de anuncios) entre los textos de las publicaciones. Puede forzar esto o usar estas técnicas para ayudar a los autores a recordar agregarlas.

En esta publicación, veremos dos formas en que puede controlar los bloques en WordPress Gutenberg. Una forma es limitar qué tipo de bloques se pueden agregar. En otras palabras, elimine ciertos tipos de bloques que no desea que estén disponibles. Podemos hacer esto específicamente por tipo de publicación o globalmente. La otra forma es usando plantillas de bloques. WordPress le ofrece decidir un conjunto de bloques predefinidos cuando crea una nueva publicación. Esto se hace por tipo de publicación. Con las plantillas de bloques, puede ofrecerle al autor los bloques iniciales para ayudarlo a escribir la publicación, o puede bloquear los bloques en su lugar para que el autor no pueda cambiar su posición o agregar otros nuevos.

Puede hacer ambas cosas con PHP o Javascript. Esta guía cubrirá la forma de PHP.

Eliminar tipos de bloques

Lista negra

Hay un filtro PHP en WordPress llamado allowed_block_types. Este filtro te da dos parámetros; una matriz de todos los bloques y el objeto de publicación. Todo lo que tenemos que hacer es administrar la matriz antes de devolverla. Y debido a que también obtenemos el objeto de publicación en el filtro, también podemos agregar reglas por tipo de publicación u otra metainformación de publicación.

La matriz de bloques consta de cadenas de nombres con espacio de nombres del bloque. Todos los bloques en WordPress requieren un espacio de nombres prefijado antes del nombre del bloque. Para los bloques principales de WordPress, el espacio de nombres es " core/" y para los bloques incrustados de WordPress, el espacio de nombres es " core-embed/". Por ejemplo, el bloque de encabezado tiene el nombre " core/heading" en esta matriz. Creé una descripción general completa de los nombres de todos los tipos de bloques en mi publicación sobre Cómo para acceder y analizar los bloques de una publicación.

Aquí hay un ejemplo rápido del uso del filtro para eliminar todos los bloques excepto el párrafo. Esto se aplicará a todos los tipos de publicaciones.

add_filter('allowed_block_types', function($block_types, $post) {
    return ['core/paragraph'];
}, 10, 2);

Si agrega este código en su tema functions.phpo archivo de complemento, el resultado es que Gutenberg rechaza por completo cualquier otro bloque que no sea el párrafo. Ni siquiera podrás ver ningún otro bloque, ni puedes intentar atraerlos escribiendo " /" en la publicación (atajo de bloque) o buscándolos.

Podemos definir los bloques que queremos mantener o eliminar por tipo de publicación. Simplemente verificamos la propiedad post_typeen el objeto de publicación. En el ejemplo de código a continuación, definimos una nueva matriz de los bloques que queremos permitir y agregamos esta regla solo para el tipo de publicación personalizada ‘ book‘.

Con el código anterior, obtiene todos los bloques al editar publicaciones y páginas, pero al editar el tipo de publicación personalizado ‘ book‘, solo puede agregar párrafos, encabezados e imágenes individuales.

Usa tu imaginación para agregar tus propias reglas. Debido a que tenemos el objeto de publicación, podemos acceder a la mayor parte de la información que necesitaríamos. ¿Quizás necesite limitar las opciones de bloque por un valor meta de publicación? Por ejemplo, por plantilla de página elegida, categoría de publicación elegida u otra cosa.

Lista blanca

Por lo que puedo ver, solo puede incluir bloques en la lista blanca (decidir cuáles eliminar, en lugar de decidir cuál conservar) anulando el registro de los bloques en un punto determinado. Y tienes que hacerlo con Javascript y no con PHP.

No entraré en detalles sobre esto, pero deberá poner en cola un archivo Javascript cargado inito enqueue_block_editor_assetsenganchado, con wp-dom-readyy wp-blockscomo dependencia. Dentro del script, puede configurar una variable de las que desea eliminar, siguiendo las mismas reglas para espacios de nombres y nombres de bloques anteriores. Y para cada nombre de bloque, llama a la función unregisterBlockType()del wp.blockspaquete. Por lo general, deberá hacer esto dentro de una función wp.domReady()para asegurarse de que el orden de carga del script sea correcto.

Algo como esto:

var removeBlocks = [
    'core/paragraph',
    'core/heading',
    'core/image'
];
 
wp.domReady(function() {
    removeBlocks.forEach(function(blockName) {
        wp.blocks.unregisterBlockType(blockName);
    });
});

Eliminar tipos de bloques es una forma de controlar bloques en Gutenberg. Veamos la otra forma, quizás más divertida, de controlar los bloques: las plantillas de bloques.

Plantillas de bloque

Otra forma de controlar los bloques de Gutenberg en WordPress es mediante el uso de plantillas de bloques. WordPress tiene una funcionalidad que le permite completar nuevas publicaciones con un conjunto de bloques predefinidos. Esto puede ser útil para ayudar a los autores mostrándoles una sugerencia de estructura de bloque. También puede optar por bloquear estos bloques precargados, por lo que no permite que los autores reordenen o agreguen otros bloques. Esto es útil cuando desea que las publicaciones tengan una estructura y un diseño específicos; por ejemplo, asegurarse de que todas las publicaciones de ese tipo de publicación tengan su información estructurada exactamente de la misma manera.

Podemos agregar plantillas de bloque con un nuevo parámetro a la [register_post_type](https://developer.wordpress.org/reference/functions/register_post_type/)()función que se usa para registrar tipos de publicaciones personalizadas (nota: el nuevo parámetro aún no se ha agregado a la documentación). También puede agregar o ajustar los parámetros en los tipos de publicaciones existentes, como publicaciones y páginas; consulte cómo hacerlo a continuación.

El nuevo parámetro para register_post_type()es ‘ template‘. Como valor para ‘ template‘, debe proporcionar una matriz de bloques. Cada bloque también debe ser una matriz. Como mínimo, debe proporcionar el primer elemento de la matriz; el nombre del bloque (p. ej core/paragraph. ). Opcionalmente, puede agregar un segundo elemento de matriz para atributos y un tercer elemento de matriz para bloques anidados (por ejemplo, bloques de portada, columnas). Será más claro cuando veas el código.

Comencemos de forma sencilla. Supongamos que tenemos una register_post_type()llamada de función para registrar un tipo de publicación personalizada ‘ book‘. Queremos completar previamente todas las publicaciones nuevas de este tipo de publicación con un bloque de párrafo con un marcador de posición que le diga al autor lo que debe escribir.

Tenga en cuenta que la matriz de atributos (con ‘marcador de posición’ en ella) es opcional. Ahora, con este parámetro de ‘plantilla’ cada vez que creamos nuevas publicaciones, se creará con un bloque de párrafo que tiene el marcador de posición "Escribe tu introducción aquí…".

Veamos un ejemplo más complicado: bloques anidados. Digamos que queremos agregar un bloque de Portada que tiene un bloque de título, un párrafo y un botón dentro, alineado al centro. El título y el párrafo tendrán un marcador de posición:

La siguiente imagen muestra lo que obtendremos cuando creemos nuevas publicaciones de libros. Parece menos intimidante que un lienzo en blanco, ¿verdad?

Tenga en cuenta que los atributos son diferentes en cada tipo de bloque y también pueden diferir en su configuración. En el ejemplo de código anterior, agrego dos atributos al bloque Portada; bloquee la alineación a "Ancho completo" y superponga el color a un color predefinido de una paleta de colores personalizada.

Las alineaciones de bloque "Ancho ancho" y "Ancho completo" deben admitirse específicamente en su tema. Tengo una publicación que explica cómo agregar soporte en su tema para alineaciones de bloques adicionales si no está familiarizado con esto. En segundo lugar, mi tema proporciona una paleta de colores personalizada de Gutenberg donde uno de los colores de la paleta se llama ‘perfil azul’. Esto probablemente no existirá en su código. El enlace anterior también explica esto si no está familiarizado con la paleta personalizada de Gutenberg.

La razón por la que elijo proporcionar un color superpuesto como atributo es por cómo se comporta el bloque Cover. Cuando crea un bloque de portada, comienza pidiéndole que elija entre configurar una imagen de fondo o elegir un color de fondo. Hasta que el autor elija activamente uno de estos, el bloque Portada oculta cualquier contenido que tenga (el encabezado, el párrafo y el botón que agregamos). Aparecerán de repente después de elegir una imagen o un color. Por lo tanto, para evitar confusiones, he preseleccionado un color de fondo para que el autor vea todos los bloques dentro de inmediato. El color siempre se puede cambiar en el Inspector (barra lateral) de todos modos.

Bloqueo de la plantilla de bloque

Con la plantilla de bloque proporcionada, el autor puede reorganizar y eliminar cualquiera de los bloques precargados, así como agregar nuevos bloques en cualquier lugar que desee. Si desea evitar esto, hay otro parámetro para register_post_type(): ‘ template_lock‘.

El template_lockparámetro ‘ ‘ acepta dos valores; ‘ all‘ o ‘ insert‘.

Establecer ‘ template_lock‘ en ‘ all‘ impide completamente que los autores reorganicen, eliminen o agreguen nuevos bloques a su plantilla de bloques. Solo pueden editar el contenido y la configuración de los bloques definidos como plantilla de bloque. Esto es útil en los casos en los que desea que todos los tipos de publicaciones consten de los mismos bloques en el mismo orden, ni más ni menos.

El uso de ‘ insert‘ para ‘ template_lock‘ permite a los autores reorganizar los bloques en la plantilla de bloques. Pero los autores aún no pueden agregar nuevos bloques ni eliminar ninguno de los bloques.

Así es como bloquearía completamente la plantilla de bloque para el tipo de publicación personalizada ‘ book‘:

El uso de una plantilla de bloque bloqueado en Gutenberg se verá a continuación. Tenga en cuenta que faltan los íconos de acción para reorganizar bloques, así como también faltan los enlaces de eliminación de bloques en el menú. Tampoco hay íconos de acción para agregar nuevos bloques (el pequeño "+") en ninguna parte.

Ajuste de plantillas de bloque para tipos de publicaciones existentes

Si desea utilizar plantillas de bloque en publicaciones o páginas, también puede hacerlo. Engancha una función inity usa [get_post_type_object](https://developer.wordpress.org/reference/functions/get_post_type_object/)(). Proporcione el tipo de publicación que desea como parámetro (ya sea ‘ post‘ o ‘ page‘). Esto devuelve un objeto al que puede asignar la propiedad ‘ template‘ y ‘ template_lock‘.

Este es un ejemplo de cómo agregar la misma plantilla de bloque y propiedad de bloqueo que arriba en las páginas:

Conclusión

En esta publicación hemos aprendido cómo lograr un mayor control de los bloques en el editor de WordPress Gutenberg. Hay muchos beneficios de hacer esto, especialmente en combinación con tipos de publicaciones personalizadas que deben seguir una estructura específica. El uso de las técnicas anteriores lo ayudará a agilizar más su proceso, tanto como webmaster (ayudando a las personas a escribir mejores publicaciones) como desarrollador de temas (garantizando un diseño común). Las plantillas de bloques bloqueados pueden ser una solución diferente a las plantillas de publicaciones personalizadas y metadatos de publicaciones.

La personalización de plantillas de bloques sigue siendo una característica bastante oculta de Gutenberg en este momento. Pero espero que cambie a medida que Gutenberg se desarrolle y obtenga un lugar más familiar dentro de WordPress.