Sigue este blog vía RSS, en el Fediverso en @acambronero@www.blogpocket.com, o vía email.

You don’t speak Spanish? Explore a selection of Blogpocket posts in English

Tips, consejos y recursos para aprender Gutenberg (WordPress 6.1) para constructores de sitios y creadores de contenidos

Share to social media
APRENDER-GUTENBERG-6-1-1024x576 Tips, consejos y recursos para aprender Gutenberg (WordPress 6.1) para constructores de sitios y creadores de contenidos

Este post para aprender Gutenberg ha sido actualizado el 16 de octubre de 2022.

¡Aprende Gutenberg (WordPress 6.1) ahora! Desde que salió la nueva versión del editor de bloques en WordPress, en Blogpocket hemos venido publicando contenidos para aprender Gutenberg. También habrás oído hablar del editor de bloques y la edición completa del sitio.

Contra las primeras reacciones contrarias (algunas voces tacharon al nuevo editor de virus), Gutenberg se ha consolidando como lo mejor que le ha ocurrido a WordPress en muchos años. No te quedes atrás y aprende Gutenberg ahora con nosotros.

En Blogpocket, apostamos desde el primer momento por Gutenberg, no solo para la composición de páginas y posts (como al principio muchos recomendaban únicamente) sino también para crear el front-end de tu sitio web. El tiempo nos ha dado la razón y hoy ya no tiene ningún sentido la convivencia del editor clásico con Gutenberg ni, por supuesto, ocultar al editor de bloques. Con proyectos como Iceberg, demistraron que quedarse parado en el editor clásico es un error, aunque no te guste Gutenberg (no encuentro razones por las que no te pueda gustar). Las posibilidades son infinitas.

El lanzamiento, a primeros de 2022, de WordPress 5.9 impulsó una nueva manera de afrontar la creación de un sitio web. WordPress 6.1 profundiza en ello.

Lo que sigue es el post original tal y como se escribió y publicó en enero de 2022. A lo largo de 2022 se sucedieron nuevas versiones en las que se mejoraron y progresaron las funciones del editor de bloques y de la edición completa del sitio. Aquí, en Blogpocket, lanzamos nuevas publicaciones haciéndonos eco de las novedades. Sigue la serie FSE News, la etiqueta Gutenberg, el videopodcast HECHO CON BLOQUES y suscríbete a la newsletter para ponerte al día.

Cómo aprender Gutenberg

En este artículo pasaremos revista a recursos extraordinarios que te servirán para aprender Gutenberg e implementar un sitio web de WordPress de estilo profesional por ti mism@ usando exclusivamente el editor de bloques.

¿Qué es Gutenberg y cómo funciona?

Naturalmente, el primer paso es repasar las guías de Blogpocket para aprender Gutenberg, cuyo propósito es que te hagas una idea general del editor de bloques, qué es y cómo funciona. Hay dos guías fundamentales:

Introducción: Cómo revolucionará Gutenberg la industria de WordPress en 2022.

En WPTavern, Justin Tadlock dio una descripción general de ¿Qué son los temas de bloque? Lo que necesita saber antes de WordPress 5.9 para aquellos usuarios de WordPress que han oído hablar recientemente sobre temas de bloques y la edición completa del sitio (FSE). Es una excelente publicación para empezar para todos aquellos que se están interesando en las características de WordPress 5.9.

Edición completa del sitio

Esta es una parte muy interesante del proyecto y si quieres aprender Gutenberg, y no quedarte atrás, debes ponerte las pilas. WordPress 5.9 (enero de 2022) incluye la edición completa del sitio (FSE) mediante la adopción en el core de WordPress de lo que hasta ahora ha estado en desarrollo.

En Blogpocket tenemos un curso de FSE que te invito a revisar.

Lo importante es que ya se puede diseñar desde cero un tema de WordPress con Gutenberg.

Pero hemos hecho un par de ilustraciones para que te detengas un momento a pensar qué es diseñar un tema, qué es lo que podías hacer en la era pre-Gutenberg, qué podías hacer en la era Post-Gutenberg) y qué podrás hacer a partir de ahora (post FSE).

Estructura-web Tips, consejos y recursos para aprender Gutenberg (WordPress 6.1) para constructores de sitios y creadores de contenidos
Las páginas de una web pueden tener un diseño compuesto por Cabecera, Contenido, Sidebar y Footer. Una landing page puede carecer de Cabecera y Footer. Cualquier combinación es posible pero los themes de WordPress, en la era pre-Gutenberg, se personalizaban solo mediante las áreas de widgets que encajaban en esos apartados.
Pre-Gutenberg Tips, consejos y recursos para aprender Gutenberg (WordPress 6.1) para constructores de sitios y creadores de contenidos
En la era Post-Gutenberg y pre-FSE podíamos personalizar la home de un tema de WordPress con Gutenberg sin necesidad de usar áreas de widgets. Incluso, en las áreas de widgets preparadas para el sidebar y los footers podemos utilizar bloques de Gutenberg mediante el uso de bloques reutilizables y el plugin Reusable Blocks Extended. Lo que aporta la FSE es poder editar el sitio completo con bloques de Gutenberg.

Así que, centrándonos en lo que se podía hacer hasta ahora con Gutenberg (era pre-FSE), teníamos dos ubicaciones de un tema dónde poder actuar y cómo:

  • Home. En la era Pre-Gutenberg estábamos muy limitados por lo que el desarrollador había preparado en el área de widgets del tema. En la era post-Gutenberg y pre-FSE, podíamos «limpiar» la home y diseñarla a nuestro gusto con el editor de bloques. Por ejemplo, en Genesis Framework y en los temas compatibles con Gutenberg, es posible optar por importar la demo para modificar la home según tus necesidades o partir de una home vacía para rellenarla a tu gusto.
  • Áreas de widgets. ¿Y cómo puedo en la era pre-FSE personalizar las áreas de widgets previstas en un tema con bloques de Gutenberg? Básicamente, activando el plugin Reusable Blocks Extended. Este plugin hace una cosa maravillosa: incorpora un nuevo widget a los disponibles en Apariencia > Widgets para que se pueda añadir bloques reutilizables en cualquier área de widgets del tema.

De esta manera, excepto en la cabecera es posible diseñar casi todo el tema de WordPress a nuestro gusto con Gutenberg. Esta es la idea que quisimos plasmar de manera práctica, y a modo de aula didáctica en Lanzatu.blog con nuestros tema Blogpocket Nineteen (servido en dos sabores: Genesis y para todos los públicos)

Te invito a leer Cómo crear y diseñar una web de WordPress eficiente en tan solo dos pasos, donde se explica el concepto de desarrollo de un sitio web basado en crear primero una web inicial de WordPress eficiente y, después, aplicar Gutenberg para conseguir los contenidos y el diseño completo del sitio.

«La edición completa del sitio cambiará la forma en que todos usan los temas y cómo los construimos«, escribió Carolina Nymark en su sitio web. Ella es miembro del equipo de temas de WordPress y mantiene un curso gratuito sobre un tema basado en bloques de construcción y prepararlos para la edición completa del sitio con Gutenberg: Full site editing will change how everyone uses themes and how we build them.

WordPress 5.9

WordPress 5.9 nos traerá la FSE pero solo se activará si instalas y activas un tema de bloques. Antes de WordPress 5.9 hemos podido probar la FSE, mediante el plugin denominado Gutenberg, cuyas funcionalidades van por delante de las que se añaden al core de WordPress: Blogpocket Twenty: cómo probar la Edición Completa del Sitio (FSE, por sus siglas en inglés)

Eso significa que aunque tengamos WordPress 5.9 y estemos en disposición de saltar a la FSE, todavía conservamos las funcionalidades pre-FSE. Esto, sin duda, evitará problemas de transición para usuarios y desarrolladores.

Esta es la guía de campo con todas las funciones nuevas de WordPress 4.9.

Antes del lanzamiento de WordPress 5.9 así se puede probar: Cómo probar WordPress 5.9: la próxima parada en el camino a la edición completa del sitio.

Birgit Pauli-Haack, de Gutenberg Times ha realizado la siguiente recopilación de recursos para aprender Gutenberg, a partir de WordPress 5.9, para constructores de sitios y creadores de contenidos. Se ha traducido el texto original.

Documentación

  • Editor del sitio. Solo está disponible para los creadores de contenido que usan un tema de bloques. Cuando utilizas el Editor del sitio, la mayoría de los cambios aquí se realizan en todo el sitio.
  • Temas de bloques. Un tema de bloques es un tema que utiliza bloques para todas las partes de un sitio, incluidos los menús de navegación, el encabezado, el contenido y el pie de página del sitio.
  • Resumen de estilos.Esta es una nueva función en WordPress 5.9 que viene incluida en los temas de bloques y que te permite personalizar tu sitio tanto como quieras con diferentes colores, tipografías, diseños y más.
  • Bloque de navegación. El  bloque de navegación  es un bloque avanzado en WordPress 5.9 que te permite editar el menú de navegación de tu sitio, tanto en términos de estructura como de diseño. El  bloque de navegación  se puede usar con un tema de bloque o un tema compatible con la edición de plantillas.
  • Bloque de parte de plantilla. El  bloque Elemento de plantilla  es un bloque avanzado introducido en WordPress 5.9 que se puede usar con un tema de bloque o un tema que admita la edición de plantillas.

Temas basados en bloques, listos para la edición de sitio completo (FSE)

Hasta la fecha, encontrarás 34 temas de bloque que ya están en el repositorio de WordPress y que están preparados para la edición completa del sitio.

Estos son los temas que me gustan:

Los tres son de diseñadores de temas de confianza y fueron revisados ??por Justin Tadlock en WPTavern.

Automattic también publicó un conjunto de temas, todos enfocados en blogs y escritura:

También tenemos el primer tema de bloque predeterminado de WordPress, llamado Twenty-Twenty-Two. Carlo Danielle hizo una inmersión profunda en el funcionamiento interno de Twenty-Twenty Two y te lleva a dar un paseo en su publicación para Kinsta. Los diseñadores y desarrolladores Kjell Reigstad y Jeff Ong trabajaron en él con otros colaboradores. Se lanzará con WordPress 5.9. El nuevo sitio de WordPress lo activará de inmediato.

En Blogpocket, también hemos trabajado con Blockbase, un tema universal de bloques de Automattic: Cómo crear un tema secundario de Blockbase.

Repasa, por favor, nuestro FAQ para entender términos relacionados con Gutenberg y la construcción de sitios y la creación de contenidos.

Justin Tadlock de WPTavern revisa un tema de bloques minimalista denominado Livro en Livro Is a Minimal Block Theme for Writers de Automattic.

Acerca de funciones que desaparecerán en WordPres 5.9 y nuevas características

El personalizador desaparecerá para algunos usuarios de Block Theme con WordPress 5.9. Pero Justin Tadlock describe cómo el Personalizador solo desaparecerá cuando actives un tema de bloque. Y solo si no tienes plugins instalados que accedan al Personalizador para obtener configuraciones de funciones adicionales. Si no cambias tu tema, toda tu personalización permanecerá en su lugar y no perderá ningún código CSS personalizado.

En su publicación Qué esperar en WordPress 5.9 de GutenbergTammie Lister nos expone una descripción general de las funciones que componen la Edición completa del sitio (FSE) cuando actives un tema de bloques.

La FSE nos abre un mundo infinito de posibilidades a los constructores de sitios pero también a los usuarios finales y a los creadores de contenidos. Pero están lanzándose productos de terceros que pueden ayudar a crear más fácilmente el front-end de un sitio web. Por ejemplo, Cwicly o Gutentor.

Cursos

En Learn.WordPress.org , el curso Diseño de sitio simple con edición completa del sitio ya está disponible en línea. Es la parte 1 de una serie de 2 o 3 cursos que saldrán pronto y es gratis

En Fullsiteediting.com , Carolina Nymark, colaboradora del equipo de temas de WordPress, preparó dos cursos

Aprender Gutenberg: Conclusiones

Aprender Gutenberg ahora con la información que te damos en Blogpocket es fácil y lo tienes todo a mano. Danos feedback, por favor.

Me gusta Gutenberg y me gusta que te guste Gutenberg 😉 Te dijeron «aprende Gutenberg» y ahora lo tienes más claro.

Mi misión es que Blogpocket te sirva para aprender Gutenberg, así que aquí estoy para ello.

Esta guía contiene suficientes recursos para que sepas cómo funciona Gutenberg y lo apliques en tu web; pero estoy atento a tus comentarios.

Responder en Mastodon (requiere usuario en esa plataforma)

Puedes usar tu cuenta de Mastodon para responder a este post de

Copia y pega esta URL (https://www.blogpocket.com/?p=63659) en el campo de búsqueda de la interfaz web de tu servidor Mastodon.

Icono de Mastodon

12 respuestas a «Tips, consejos y recursos para aprender Gutenberg (WordPress 6.1) para constructores de sitios y creadores de contenidos»

  1. Ricardo la Rosa

    Simplemente wow, la guía más completa que me he encontrado sobre Gutenberg.

    En definitiva, creo vino a darle un nuevo tinte a WordPress, ya que Gutenber viene bastante completo.

    Estaré repasandola varias veces ya que hay muchos detalles a tomar en cuenta, y tengo entendido se estará actualizando ¿cierto?

    Saludos!

    1. Hola Ricardo, en primer lugar: muchas gracias por el feedback. Gutenberg, efectivamente, vino para quedarse y es una herramienta muy útil no solo para componer los contenidos de las entradas sino también para diseñar la home y las páginas de cualquier theme. El post se actualiza frecuentemente y también tienes mi newsletter donde cada semana iré publicando noticias y recursos interesantes sobre Gutenberg. Saludos 🙂

  2. Gustavo Woltmann

    Había leído hace algún tiempo algo sobre Gutenberg, pero no había captado realmente la información. Tu artículo me ayudó a entender y concretar un poco más la información, gracias, y saludos.
    -Gustavo Woltmann.

    1. Hola Gustavo. Me alegro de que este post sobre Gutenberg te haya ayudado a entender el potencial de Gutenberg. Muchas gracias por el feedback. Un saludo 🙂

  3. He descubierto uno de los mejores blogs de la actualidad.

    1. ¡Eso suena muy bien! Me alegro de que os guste Blogpocket 🙂

  4. Excelente información, gracias por compartir estos consejos con los que estamos iniciando, saludos!

    1. Gracias por el feedback, Eva. Saludos 🙂

  5. brayan

    Increíble articulo!!! Realmente lo disfrute y aprendí de el que me recordó porque me apasiona el marketing de afiliados XD En realidad ya hace un tiempo especialmente cuando inicie me sentía perdido, pero este tipo de artículos y específicamente un webinar Gratis jejejejeje me ayudaron a descubrir cómo ganar dinero por internet y vivir el estilo de vida que deseaba y obtener tiempo libre para mí para mi familia y mis actividades favoritas que no encontré en otro empleo y estuve en buenos empleos para los que también se sientan perdidos pueden ver el entrenamiento gratuito y canal de información aquí espero ayude a alguien XD

    1. Gracias por el feedback. Saludos :))

  6. Jorge A. Mirada B.

    Espero con ansias el FSE, aún no lo he probado y he decidió esperar a que se añada al core.

    Al principio no entendía a los detractores de Gutenberg ahora los entiendo porque ha sacado a muchos de una zona de confort soportada por DIVI y Elementor esto les ha permitido lo que llamo las fast-food-web y en consecuencia mejorar la dinámica de la producción pudiendo ofrecer buenos resultados a bajo costo para los clientes. Gutenberg lo permitirá pero debemos verlo de una nueva manera. También ha sido una cuesta arriba para los pequeños creadores de plugins dejando con una ventaja más amplia aun a los grandes que cada vez son más grandes.

    He realizado dos webs totalmente con Gutenberg soportadas con el tema Astra y estoy encantado la velocidad de las mejoras y ampliaciones me hace pensar que hay por allí gente que nunca duerme.

    Desde un poco antes de la pandemia decidí ingresar de nuevo en el mundo wordpress y ha sido un nuevo aprendizaje lo tome como si entrara desde cero por lo que Gutenberg más bien ha sido como un regalo del cielo, he visto muchos de tus tutoriales y simplemente te digo gracias, gracias, gracias.

    1. Gracias a ti, Jorge por tu feedback y el comentario acertado sobre Gutenberg. Saludos cordiales 🙂

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