Cómo exportar e importar bloques de Gutenberg en WordPress

Al principio, los usuarios de WordPress tenían una relación agridulce con el generador basado en bloques de WordPress. Luego, como descubrimos en nuestra guía de Gutenberg, el nuevo editor viene con características sorprendentes que hacen que crear contenido hermoso sea fácil y divertido. Ahora, algunos no pueden tener suficiente del editor.

Gutenberg le ofrece suficientes funciones para crear páginas y publicaciones notables, sin escribir código. No importa el contenido que desee agregar, Gutenberg tiene solo el bloque.

¬ŅDesea modificar y dise√Īar cada bloque de contenido ampliamente? Gutenberg te respalda gracias a una bater√≠a de opciones de personalizaci√≥n. ¬ŅDesea incluso m√°s bloques de los que est√°n disponibles en el editor predeterminado? Hay un mont√≥n de complementos adicionales de Gutenberg por ah√≠.

Por eso es triste que muchos usuarios no sepan Bloques reutilizables, una de las características brillantes de Gutenberg. Si no tiene idea de lo que estamos hablando, los bloques reutilizables son simplemente contenido bloques que crea, guarda y reutiliza a voluntad.

Supongamos que desea agregar un llamado a la acción, una nota de agradecimiento, una firma, un formulario o cualquier otra cosa al final de cada publicación o página.

En el pasado, tenía que guardar la función en un archivo de texto en su computadora. Cuando lo necesitabas, lo copiabas y pegabas en tu publicación o página. Gutenberg ha aliviado este problema. Ahora no tiene que usar archivos de texto o crear los mismos bloques desde cero cada vez.

Puede crear un solo bloque reutilizable y usarlo no solo en sus publicaciones y páginas, sino también en otros sitios web de WordPress.

Ya sea que cree muchos sitios web o necesite agregar contenido especial a cada publicación / página, los bloques reutilizables de Gutenberg pueden ayudarlo a ahorrar mucho tiempo.

Y en la publicaci√≥n de hoy, le mostramos exactamente c√≥mo crear y exportar bloques reutilizables de Gutenberg en WordPress. Nuestro objetivo es ayudarlo a mover y reutilizar bloques de contenido personalizados en m√ļltiples publicaciones / p√°ginas / sitios web de WordPress f√°cilmente.

Aparte: Si crea un bloque usando un complemento como Getwid, por ejemplo, debe instalar el complemento en los otros sitios de WordPress que desea reutilizar dicho bloque. Tenga en cuenta también que sus bloques pueden verse ligeramente diferentes de un tema a otro, pero todo está bien porque Gutenberg le ofrece una gran capacidad de personalización.

Fuera del camino, toma una taza de café y disfruta leyendo.

En primer lugar, necesitas bloques reutilizables

Desafortunadamente, no puedes exportar ni importar regular bloques Para exportar e importar bloques de Gutenberg, primero debe crear reutilizable bloques

Con fines ilustrativos, crear√© una nota de agradecimiento que me gustar√≠a agregar al final de cada publicaci√≥n que publique. Ya sabes, sin reescribir la nota cada vez que necesito agregarla a una publicaci√≥n ūüôā

Mi nota de agradecimiento no es nada compleja; solo un simple bloque de p√°rrafo con enlaces a Twitter y Facebook. Tenga en cuenta que su bloque puede ser lo que desee: un anuncio publicitario, un control deslizante de im√°genes, una cita, una lista, las √ļltimas publicaciones, el formulario de MailChimp, etc.

M√°s tarde, le mostrar√© c√≥mo exportar la nota (leer, bloquear) a un segundo sitio web de WordPress. ¬ŅSuena bien? Genial, comencemos.

Cómo crear un bloque reutilizable

Crear un bloque reutilizable es increíblemente fácil. Navegar a Publicaciones> Agregar nuevo para lanzar el editor Gutenberg:

Agregar una nueva publicación de WordPress

A continuación, haga clic en el Agregar bloque (+) icono y luego elija su bloque de contenido. En nuestro caso, agregué el bloque de párrafo, como se muestra en la siguiente imagen.

Agregar bloque Gutenberg en WordPress

Despu√©s de eso, personaliza y dise√Īa tu bloque seg√ļn tus necesidades. Agregu√© texto, enlaces de redes sociales y color de fondo. As√≠ es como nuestro nuevo bloque tambi√©n conocido como nota de agradecimiento mira en mi editor de Gutenberg:

Muy lindo John Doe. Muy agradable. Ahora, probablemente seguir√© tu blog en las redes sociales ūüôā Avanzar r√°pidamente.

Por el momento, la nota anterior es un regular bloquear. Necesitamos convertirlo en un reutilizable bloque que podemos exportar e importar. Para hacer eso, haga clic en el Mas opciones icono, y luego Agregar a bloques reutilizables, Como se muestra abajo.

Luego, nombra tu bloque reutilizable y presiona el Salvar botón, como se ve a continuación.

nomenclatura del bloque gutenberg reutilizable

Y eso es todo, acabas de crear tu primer bloque reutilizable. Así se hace amigo.

Cómo usar bloques reutilizables

Agregar el bloque reutilizable que acabamos de crear a sus publicaciones o p√°ginas es extremadamente f√°cil. Una vez que haya agregado el contenido requerido a su publicaci√≥n o p√°gina, haga clic en el Agregar bloque (+) √≠cono, despl√°cese hasta Bloques reutilizables pesta√Īa y elija su bloque (Nota de agradecimiento en nuestro caso), como se muestra a continuaci√≥n.

bloque reutilizable gutenberg

Después de agregar el bloque reutilizable a su publicación o página, presione el Avance/Publicar botón para ver sus resultados en el front-end. Esto es lo que obtuve:

Mi sitio de prueba ejecuta el tema Twenty Twenty.

La mejor parte es que puedo reutilizar mi bloque de notas de agradecimiento en cualquier momento, sin tener que crearlo desde cero. Puedo agregarlo a todos los tipos de publicaciones que admiten bloques de Gutenberg.

Ahora que sabe cómo crear y usar bloques reutilizables, aprendamos más sobre cómo exportar estos bloques a otro sitio web de WordPress. Para evitar confusiones, usaré el mismo bloque que acabamos de crear.

Cómo exportar bloques de Gutenberg en WordPress

Exportar un bloque Gutenberg reutilizable es cosa de estudiantes de cuarto grado que se har√° en poco tiempo.

¬ŅQu√© hacer?

Dentro del editor Gutenberg, haga clic en el Más herramientas y opciones icono, y luego Gestionar todos los bloques reutilizables, como destacamos a continuación:

gestionar todos los bloques reutilizables

Hacerlo te lleva a la Bloques pantalla donde puede ver y administrar todos sus bloques reutilizables:

Solo tenemos el Nota de agradecimiento bloque, pero la pantalla anterior se completará a medida que crees más. Para exportar, pase el mouse sobre el título y haga clic en Exportar como JSON enlace que aparece. Ver la imagen de abajo.

A continuación, guarde el archivo JSON en su computadora:

Ahora que tenemos el archivo JSON en su computadora, es hora de importar el bloque a nuestro segundo sitio de prueba.

Cómo importar bloques de Gutenberg en WordPress

Importar sus bloques reutilizables es tan f√°cil como A, B, C. En primer lugar, abra el editor Gutenberg. En segundo lugar, haga clic en el M√°s herramientas y opciones icono, y luego Gestionar todos los bloques reutilizables, Como se muestra abajo.

Sobre el Bloques pantalla que sigue, haga clic en Importar desde JSON, elija el archivo que descargó anteriormente y luego presione el Importar botón en ese orden:

¡Y eso es! Simplemente así, ha importado con éxito un bloque Gutenberg reutilizable a su segundo sitio de WordPress:

¬ŅNo fue tan f√°cil? Despu√©s, puede usar y reutilizar su bloque Gutenberg en el segundo sitio web tantas veces como lo desee.

¬ŅHay complementos para exportar bloques de Gutenberg?

Ah, sí, y encontré uno de ThemeIsle, un desarrollador de WordPress de buena reputación. Es un complemento gratuito conocido como Blocks Export Import. Esencialmente, el complemento le permite omitir este tutorial completo. Sí es cierto; ni siquiera tiene que crear bloques reutilizables.

Instale y active el complemento, y luego abra el editor Gutenberg. Dise√Īa tu bloque como desees y luego haz clic en el Mas opciones icono. A continuaci√≥n, presione el Exportar JSON, Como se muestra abajo. Aqu√≠ est√° la captura de pantalla:

Al hacerlo, se descarga el archivo JSON a su computadora. Para importar el archivo JSON con el complemento, abra el editor Gutenberg. A continuaci√≥n, haga clic en el Agregar bloque icono, y luego Importar bloques de JSON bajo la Widgets leng√ľeta:

Después de eso, haga clic en Elija el archivo para seleccionar el archivo de su computadora y presione el Subir botón:

El √ļnico problema con el m√©todo del complemento es que sus bloques no se guardar√°n en su sitio de WordPress. Para guardar bloques en su base de datos de WordPress, debe usar el m√©todo manual. Tal vez eso cambie en el futuro.

Lamentablemente, no pude encontrar otro complemento. A√ļn as√≠, el complemento puede ahorrarle mucho tiempo si no le importa guardar bloques reutilizables en su sitio web. Tendr√°s los bloques como archivos JSON en tu computadora.

Los bloques reutilizables de Gutenberg son un salvavidas. Le permiten replicar plantillas y funciones r√°pidamente, ya que no comienza desde cero. Si crea muchas publicaciones / p√°ginas y / o sitios web, aprender a exportar bloques Gutenberg ser√° √ļtil.

¬ŅTiene preguntas o sugerencias sobre los bloques de Gutenberg? Por favor h√°znoslo saber en los comentarios m√°s abajo.