Guía completa de bloques y patrones reutilizables de WordPress 

Guía completa de bloques y patrones reutilizables de WordPress

El bloque reutilizable de WordPress es una característica poderosa del editor de bloques de Gutenberg. Ya no es necesario copiar y pegar fragmentos de contenido reutilizables previamente guardados desde el archivo de su computadora. En cambio, puede reutilizar fácilmente el mismo bloque de contenido en cualquier parte de su sitio web sin tener que personalizarlo cada vez.

A pesar de su eficacia, muchos usuarios desconocen esta técnica que permite ahorrar tiempo, lo que les lleva a perder tiempo y esfuerzo de forma innecesaria. Por eso hemos elaborado un artículo detallado sobre los bloques reutilizables de WordPress.

Aprenderá cómo crear, usar y configurar bloques reutilizables de WordPress y otros consejos esenciales.

Sigamos leyendo...

¿Qué es un bloque reutilizable (patrón) en WordPress?

Los bloques reutilizables de WordPress son como bloques de contenido normales que los usuarios pueden crear y guardar para usarlos repetidamente en cualquier parte de su sitio web dentro del editor de bloques. El proceso incluye agrupar varios bloques como patrones e importarlos a cualquier parte de su sitio web.

Un ejemplo común del uso de esta función es colocar el El mismo llamado a la acción o botón de redes sociales, formulario o banners promocionales de manera constante en todo el sitio web, por lo que no tendrás que personalizar lo mismo repetidamente. 

La mejor parte es que los cambios se aplicarán automáticamente a todas las páginas y publicaciones de tu sitio web. No necesitas cambiar cada aspecto individualmente. Además, también puedes exportar e importar la plantilla reutilizable a otro sitio web.

Diferencia entre bloques reutilizables y bloques normales

Estas son algunas de las diferencias clave entre los bloques reutilizables de WordPress y los bloques normales.

Bloques reutilizablesBloques regulares
Cree, guarde y reutilice en varias instancias del sitio web.Crear y utilizar para una sola publicación o página únicamente.
La edición y la personalización se actualizan automáticamente en todo el sitio web.La personalización solo afecta a la instancia específica del sitio web.
Se puede administrar fácilmente desde una ubicación centralizada.Necesidad de gestionar individualmente dentro de una publicación o página.
Disponible con funciones de importación y exportación.Se puede administrar fácilmente desde una ubicación centralizada.

¿Cuándo necesitas utilizar bloques reutilizables de WordPress? 

Una de las cosas realmente interesantes de usar bloques reutilizables de WordPress es la simplificación de los cambios en todo el sitio. Por ejemplo, si necesitas Actualiza el pie de página de tu sitio web o ajustar el descuento en un banner promocional, hay No es necesario cambiarlo manualmente en cada publicación o página.

Simplemente acceda a la configuración del bloque reutilizable y podrá realizar la actualización en solo unos clics. La gestión centralizada también garantiza la coherencia del diseño. en el sitio web completo. Además, podrá acceder fácilmente a estos bloques, ya que se almacenan en una sección dedicada de su editor de bloques. Esto significa que esta función es beneficiosa para la colaboración en equipo.

Otra cosa que mencionamos antes es que los bloques reutilizables también se pueden compartir entre diferentes sitios web. Puedes Exportar e importar sin esfuerzo un bloque reutilizable a diferentes sitios webLos bloques reutilizables de WP también son convertibles.

Cómo crear bloques reutilizables de WordPress (patrón) en el editor Gutenberg de WordPress

Abra una nueva página o publique como lo hace habitualmente. Luego, haga clic en el botón “+” icono en la esquina superior izquierda de la página para ver todos los bloques disponibles. Y, arrastra y suelta el bloque que quieres convertir en un bloque reutilizable en el panel de control del editor de bloques. 

En este tutorial, crearemos un patrón con bloques reutilizables para mostrar todos nuestros canales sociales. Para nuestro diseño, usaremos el Bloque de encabezado GutenKit y Bloque de iconos sociales GutenKit.

Tenga en cuenta que Estamos agregando ambos bloques dentro de un bloque contenedor, por lo que haremos que el bloque contenedor sea un bloque reutilizable. Pero también puedes hacer que un bloque individual sea un bloque o patrón reutilizable siguiendo el mismo proceso.

Bloques reutilizables de WordPress

Ahora, haga clic en el ícono de tres puntos en la barra de herramientas emergente para revelar algunas configuraciones adicionales y haga clic en "Crear patrón” opción. 

Bloques reutilizables de WordPress

Al hacerlo, aparecerá una ventana emergente que le solicitará el nombre y la categoría del bloque reutilizable, y un botón para alternar entre varias ubicaciones para sincronizar este bloque. Listo, solo presione el botón "Agregar" botón. 

¡Eso es todo! Has creado con éxito un patrón o un bloque reutilizable en tu sitio web de Gutenberg. Encontrarás el patrón en la categoría que se te asignó. A continuación, aprenderemos a usarlo en publicaciones o páginas.

💡 Lea también la guía para principiantes en Cómo usar Gutenberg en WordPress

Cómo configurar bloques reutilizables de WordPress en publicaciones y páginas

No existe ningún obstáculo para configurar bloques reutilizables de WordPress en su sitio web de WordPress. Comience accediendo a una página o publicación existente o creando una nueva. Haga clic en el botón "+” (Agregar bloque) como lo hizo antes. Pero aquí debe seleccionar el “Patrones" pestaña. 

Bloques reutilizables de WordPress

Accede a la categoría de tus bloques reutilizables y haz clic en ella una vez que la veas. El bloque reutilizable se agregará a tu publicación o página. Por ejemplo, en la imagen de arriba, puedes ver nuestro “Canales sociales” patrón o bloque reutilizable debajo del “Botón” categoría. Eso es todo. 

Puedes personalizarlo después de agregar un bloque o patrón reutilizable. Para ello, haz clic en el botón “Editar original” opción debajo de la barra de herramientas del bloque. Verás una nueva pantalla para editar el patrón. Sin embargo, personalizarlo también afectará otros aspectos del sitio web donde lo uses.

Cómo convertir bloques reutilizables de WordPress para una publicación específica

Conozcamos otra parte importante del uso de bloques reutilizables de WordPress, que es la personalización de los patrones o bloques reutilizables sin cambiar otros usos del bloque en el sitio web. Para ello, hay que convertir el bloque reutilizable de WordPress en uno normal. 

Bloques reutilizables de WordPress

Seleccione el bloque reutilizable y haga clic en los tres puntos verticales del lado derecho del menú de la barra de herramientas. Busque el icono “Despegar” y haz clic en ella. Al hacer esto, el bloque reutilizable se convertirá en un bloque normal. Luego, podrás realizar cualquier cambio en ese bloque.

Cómo gestionar bloques reutilizables (patrones) en el editor de WordPress

Es posible que tengas varios bloques y patrones reutilizables y quieras gestionarlos desde una ubicación centralizada. ¡No te preocupes! Tú también tienes esta ventaja. Navega hasta el panel de WordPress y sigue Apariencia > Editor

Serás movido a una nueva página, desde la barra lateral izquierda selecciona el "Patrones" opción bajo el "Diseño" Pestaña. Encontrarás todas las categorías de patrones, elige la que prefieras.

Bloques reutilizables de WordPress

En el lado derecho, verás los bloques reutilizables. Puedes editarlos, duplicarlos, eliminarlos y exportarlos para usarlos en otro sitio web de WordPress. 

Cómo importar/exportar bloques reutilizables (patrones) en WordPress

Las ventajas de utilizar bloques reutilizables de WordPress no se limitan únicamente a su uso en todo el sitio web, sino también a su exportación e importación a otros sitios web. Es un gran ahorro de tiempo para cualquier desarrollador.

Bloques reutilizables de WordPress

Si ha instalado la última versión de WordPress, desde su panel de administración, navegue como le mostramos arriba: Apariencia > Editor > Diseño > Patrones.

Bloques reutilizables de WordPress

Para exportar un bloque o patrón reutilizable:Seleccione la categoría del patrón y haga clic en el ícono vertical de tres puntos del patrón que desea exportar. Verá una opción titulada “Exportar como JSON”, Presiónelo para guardar el archivo JSON en su dispositivo.

Bloques reutilizables de WordPress

Para importar un bloque o patrón reutilizable:Cuando estés en la página de patrones, haz clic en “Agregar nuevo patrón” opción y luego presione “Importar patrón desde JSON" para cargar el archivo JSON desde su computadora.

Preguntas frecuentes

Los bloques reutilizables se almacenan en la base de datos de WordPress como un tipo de publicación personalizado llamado “wp_block”.

Puede insertar clases CSS en el “Avanzado” pestaña de la configuración del bloque reutilizable. Un campo se titularía “Clase(s) CSS adicionales" por eso.

Para eliminar bloques reutilizables de su sitio de WordPress, navegue a Apariencia > Editor > Diseño > Patrones y haga clic en el ícono vertical de tres puntos para revelar la opción de eliminar.

Los bloques reutilizables se pueden encontrar en el Apariencia > Editor > Diseño > Patrones.

¡Envolver!

En definitiva, como usuario de WordPress, buscas aquello que te facilite el trabajo. Y WordPress ha desarrollado continuamente nuevas funciones útiles que te ahorran tiempo, como los bloques recuperables.

Si sabes cómo usar y administrar los bloques reutilizables de WordPress, puedes ahorrar mucho tiempo al evitar el trabajo repetitivo. Esperamos que este blog te haya ayudado a diferenciar entre los bloques reutilizables de WordPress y los bloques normales.




Comentarios

Deja una respuesta

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