Recibe el boletín informativo, todos los lunes, y descarga nuestros ebooks exclusivos.

Cómo definir en theme.json patrones de bloques del directorio

En este post veremos cómo definir en theme.json patrones de bloques del directorio oficial de WordPress.

El directorio de patrones de bloques está abierto a todo el mundo: WordPress.org to Launch Pattern Creator to Expand Pattern Directory.

Esto es una buenísima noticia porque cualquiera puede añadir diseños (requiere revisión) al directorio.

Cómo crear un nuevo patrón de bloques en el directorio

El editor de patrones de bloques solo requiere conocer el funcionamiento del editor de bloques de WordPress y añadir el título, descripción y la categoría en la que se clasificará el diseño.

Para los archivos multimedia se debe elegir de entre los existentes en Openverse que está integrado con el editor.

Definir patrones del directorio en theme.json

Si tienes el plugin Gutenberg 12.8, o superior, instalado puedes definir en theme.json patrones de bloques del directorio, con el propósito de que aparezcan dentro de la pestaña «Patrones» del insertador de bloques. Esto es una gran ventaja porque evita más trabajo innecesario a la hora de añadir patrones de bloques del directorio en tu tema.

El mecanismo es muy sencillo, como puedes observar en el siguiente GIF. Solo debes añadir la propiedad «patterns» al archivo theme.json y el slug de la URL correspondiente al patrón del directorio. Por ejemplo, si queremos añadir el patrón https://wordpress.org/patterns/pattern/featured-service-section-with-dark-heading-image-description-and-a-button/, tendrás que añadir la siguiente instrucción al archivo theme.json, asegurándote de que la versión de éste es la 2:

«patterns»: [ «featured-service-section-with-dark-heading-image-description-and-a-button» ]

Más info aquí.

PATRONES-JSON Cómo definir en theme.json patrones de bloques del directorio

Observa en el GIF:

  • Hay que añadir una coma al final de la instrucción anterior en theme.json
  • Si el patrón de bloques está clasificado en varias categorías, en el insertador de bloques aparecerá en todas ellas, excepto en «Imágenes». En el ejemplo, lo seleccionamos desde la categoría «Botones». Si el patrón de bloques solo está clasificado en la categoría imágenes, aparecerá como «sin categoría». Ver explicación aquí.

Más información sobre novedades de Gutenberg 12.8: Gutenberg + Themes: Week of March 14th, 2022

FSE-NEWS-1024x576 Cómo definir en theme.json patrones de bloques del directorio

FSE NEWS son posts rápidos con tips, tools y noticias sobre Gutenberg y Full Site Editing (FSE). Consulta la página principal para acceder a todos los posts de FSE NEWS. Consulta el FAQ para aclarar los términos generales que se utilizan.

Comparte en Mastodon:

mastodon Cómo definir en theme.json patrones de bloques del directorio

Y aún hay más…

Cómo se hace un sitio web

Una revisión a vista de pájaro de todo lo necesario para crear un sitio web de WordPress.

Recursos

La lista de recursos recomendada en Blogpocket.

Mi lista de plugins

La lista de plugins de WordPress recomendada en Blogpocket

UN-BLOG-DE-21-MAS-1-COVER-3D-1024x944 Cómo definir en theme.json patrones de bloques del directorio

Suscríbete a la newsletter

En la newsletter «WP al día» recopilamos las ideas, trucos y noticias de actualidad acerca de WordPress, Gutenberg y la Edición completa del sitio. Recíbela todos los lunes a primera hora.

Suscríbete ahora y descarga, entre otros, nuestro último ebook «Un blog de 21 años (la historia jamás contada)!.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Información básica sobre protección de datos Ver más

  • Responsable: Antonio Cambronero.
  • Finalidad:  Moderar los comentarios.
  • Legitimación:  Por consentimiento del interesado.
  • Destinatarios y encargados de tratamiento: No se ceden o comunican datos a terceros para prestar este servicio. El Titular ha contratado los servicios de alojamiento web a GreenGeeks que actúa como encargado de tratamiento.
  • Derechos: Acceder, rectificar y suprimir los datos.
  • Información Adicional: Puede consultar la información detallada en la Política de Privacidad.

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Ir al contenido