Cabecera global
,
11 Mins Lectura

Consejos de eficiencia del flujo de trabajo para el editor de Gutenberg

Inicio Blog Negocio Consejos de eficiencia del flujo de trabajo para el editor de Gutenberg

Si has actualizado tu versión de WordPress en los últimos cinco años, es posible que ya hayas utilizado el editor de Gutenberg para realizar cambios en tu sitio web de WordPress.

Muchos miembros de la comunidad de WordPress lamentaron el cambio del editor clásico al nuevo editor, pero muchos novatos y expertos se han dejado convencer por su funcionalidad.

Para los no iniciados, repasaremos los beneficios del editor Gutenberg, y para aquellos que ya lo están utilizando, proporcionaremos algunos consejos importantes para mejorar su flujo de trabajo de WordPress.

¿Qué es el editor de bloques de Gutenberg?

El editor Gutenberg de WordPress (también conocido como editor de bloques) es un sistema para crear, formatear y publicar contenido en WordPress, el sistema de gestión de contenido elegido para el 43,1% de todos los sitios web.

Reemplazó al editor original (ahora llamado «clásico») como editor predeterminado en WordPress en 2018 con el lanzamiento de WordPress 5.0.

Tenga en cuenta que el editor clásico a veces se denomina incorrectamente editor TinyMCE. De hecho, el editor clásico se basa en TinyMCE, y Gutenberg todavía usa TinyMCE para editar texto enriquecido.

La diferencia entre el editor clásico y el editor de bloques de WordPress se relaciona, como habrás adivinado, con el uso de bloques.

Mientras que el editor clásico se ve como un editor de texto de lienzo en blanco, el editor de bloques se ve y funciona como un editor de arrastrar y soltar.

Los componentes clave del editor de bloques son su insertador (para insertar bloques), el lienzo de contenido (para editar contenido) y la barra lateral de configuración (para modificar la configuración de bloques).

Hay varios tipos de bloques disponibles, los más importantes de los cuales son los bloques de texto/contenido (por ejemplo, bloques de párrafo y listas). También puede hacer uso de bloques multimedia (por ejemplo, imágenes), diseño (por ejemplo, botones), widget (por ejemplo, calendario), tema (por ejemplo, logotipo del sitio) e incrustación (por ejemplo, YouTube).

Beneficios de Gutenberg

Beneficios del editor de bloques de Gutenberg.

Gutenberg tiene muchas ventajas para aquellos dispuestos a abandonar el editor clásico y abrazar la modularidad. Por un lado, se sigue actualizando y ampliando periódicamente, con el objetivo clave de democratizar aún más la publicación en la web.

En el momento de escribir este artículo, el plugin Classic Editor, que es mantenido oficialmente por WordPress, será compatible hasta 2024, aunque probablemente no sea una fecha límite estricta.

Más allá de preparar tu sitio para el futuro, estas son las principales razones por las que deberías hacer el cambio a usar el editor de bloques.

De uso gratuito

Al igual que su predecesor, Gutenberg es completamente gratuito y de código abierto, lo que significa que no necesitas una suscripción de pago para desbloquear todas sus funciones.

Otros creadores de páginas también tienen versiones gratuitas, pero las funciones de estas versiones suelen ser limitadas para animarte a pasarte a un plan premium.

Apto para principiantes

Aunque muchos blogueros se han resistido al cambio porque prefieren el editor clásico, Gutenberg se considera fácil de usar. No se necesitan conocimientos de codificación (por ejemplo, HTML, CSS), y los distintos tipos de bloques tienen opciones de personalización fáciles de usar.

Debido al formato de bloque de Gutenberg, te resultará más fácil implementar diseños complejos para que tu sitio web se destaque de la competencia.

Si todavía prefieres el editor clásico a Gutenberg, está bien. Puedes usar el bloque clásico y la barra de herramientas para editar tu página web como lo harías en el editor original.

Experiencia de edición mejorada

Uno de los beneficios del editor Gutenberg es que ofrece una mejor experiencia de usuario que el editor clásico.

Por ejemplo, puede elegir entre varias opciones de visualización, lo que le permite simular cómo se verá su sitio web en diferentes tamaños de pantalla. Esto hace que sea mucho más fácil crear un sitio web de WordPress listo para dispositivos móviles.

Además, Gutenberg viene con funciones más avanzadas, como bloques personalizados y una incrustación más sencilla. Y por si fuera poco, la distribución del menú es práctica e intuitiva.

En 2022, el equipo de WordPress amplió Gutenberg para permitir la edición completa del sitio, lo que significa que puedes utilizar este editor de WordPress para modificar todas las partes de tu sitio web en lugar de sólo las entradas y las páginas.

Compatible

Dado que es el editor predeterminado en WordPress, el editor de bloques no debería tener problemas de compatibilidad con la mayoría de los complementos de sitios web, como los temas y complementos de WordPress.

Dicho esto, una vez que te acostumbres a Gutenberg, no deberías necesitar tantos temas y plugins en comparación con el editor clásico de todos modos.

Sin embargo, algunas tareas como la optimización de motores de búsqueda (SEO) pueden requerir un complemento, como Yoast SEO.

Yoast se apresuró a asegurar la integración con los bloques de Gutenberg. Sus bloques de esquema (por ejemplo, bloques de preguntas frecuentes y de procedimientos) aprovechan las capacidades de Gutenberg: estos esquemas no se pueden implementar completamente en el editor clásico.

Basándonos en estos avances, es fácil ver por qué hemos clasificado a Yoast como la mejor herramienta de SEO para WordPress en 2023.

Carga de página más rápida

Debido a que es un editor integrado en el panel de control de WordPress con una amplia funcionalidad, Gutenberg podría reducir el uso de complementos y temas de WordPress, demasiados de los cuales pueden ralentizar su sitio web.

Para optimizar aún más la velocidad de su sitio web, use la última versión de WordPress y elija un proveedor de alojamiento web que proporcione estas 10 características esenciales.

Cómo mejorar la eficiencia de su flujo de trabajocon el Editor Gutenberg

¿Sigues tratando de descubrir los beneficios del editor Gutenberg?

Ciertamente, no estás solo.

La biblioteca de plugins de WordPress muestra que el plugin Classic Editor, que restaura el editor clásico, tiene más de cinco millones de instalaciones activas.

Si bien las funciones en constante expansión del editor de Gutenberg pueden no ser para todos, pueden hacer que algunas tareas más complicadas en WordPress sean pan comido.

Una vez que hayas leído nuestro manual sobre el uso del editor de bloques de Gutenberg, prueba estos consejos para mejorar la eficiencia de tu flujo de trabajo.

Aprovecha todos los diferentes bloques

Entre los bloques más utilizados se encuentran los bloques de párrafo y encabezado. Para empezar, abre tu panel de control de WordPress y navega hasta Entradas. Aquí, querrá hacer clic en Agregar nuevo.

Haz clic en Añadir nuevo para crear una nueva entrada en WordPress.
Captura de pantalla

Si eres fotógrafo, el bloque de galería te resultará útil. Y si entrevista a expertos en la materia como parte de su sitio de blog, entonces el bloque de citas podría ser útil.

Una lista de bloques de texto.
Captura de pantalla

Los escritores de poesía y los letristas pueden hacer uso del bloque de versos, mientras que el bloque de audio es ideal para los músicos que desean compartir su trabajo en línea.

Aumente la eficiencia con plantillas y patrones prediseñados

Los patrones de bloques prefabricados son útiles si necesitas inspiración para el diseño. En lugar de partir de un lienzo en blanco, puedes ahorrar tiempo eligiendo entre varias categorías de patrones, como publicaciones, texto, galería, llamada a la acción y banners.

Los patrones prefabricados son uno de los beneficios de Gutenberg.
Captura de pantalla

Crear un bloque reutilizable

Los bloques reutilizables hechos a medida son excelentes para ahorrar tiempo y mantener un diseño de sitio web consistente. Para hacer que un bloque sea reutilizable, navegue hasta la barra de herramientas sobre los bloques y seleccione el ícono de configuración de tres puntos.

Ahora, haz clic en Crear bloque reutilizable.

Cómo crear un bloque reutilizable.
Captura de pantalla

Usar atajos de teclado del editor de bloques

Si escribe barra diagonal (/), tendrá la opción de usar varios tipos de bloques sin tener que navegar hasta el insertador de bloques.

Si haces clic en los tres puntos verticales en la esquina superior derecha del editor, puedes desplazarte hacia abajo para ver todos los atajos de teclado para Gutenberg.

Como alternativa, escriba Mayús+Alt+H si está utilizando un equipo Windows (o Ctrl+Opt+H en un Mac).

El menú Herramientas en Gutenberg.
Captura de pantalla

Verás una lista de atajos que pueden agilizar tus tareas de edición de contenido, como alternar entre el editor visual y el editor de código.

Atajos de teclado.
Captura de pantalla

Encuentre su tipo de vista preferido para aumentar la productividad

Si haces clic en los tres puntos verticales en la esquina superior derecha del panel de control de tu editor de bloques, verás varias opciones de visualización, como los modos Pantalla completa y sin distracciones.

Juegue para averiguar qué vista es más eficiente para usted, ya que puede depender de la tarea.

Varias vistas en el editor de Gutenberg.
Captura de pantalla

Ahorre tiempo utilizando códigos cortos de WordPress

Un shortcode es un código básico de WordPress entre corchetes. Muchos plugins tienen sus propios códigos cortos de WordPress que puedes introducir en tu página web para añadir fácilmente elementos como botones y formularios.

Estos códigos cortos son excelentes para ahorrarle tiempo que, de otro modo, tendría que dedicar a la codificación. Y son personalizables, por lo que puedes adaptarlos a las necesidades de tu negocio y sitio web.

Si escribes «/» e ingresas «shortcode», puedes pegar directamente el shortcode elegido en el cuadro que aparece a continuación.

Cómo agregar códigos cortos fácilmente.
Captura de pantalla

Arrastra y suelta imágenes desde tu ordenador

Uno de los beneficios de Gutenberg es la capacidad de arrastrar y soltar imágenes directamente desde su máquina. Al hacer esto, Gutenberg crea automáticamente un bloque de imagen, lo que le ahorra tiempo que normalmente podría haber dedicado a cargar una imagen e intentar insertarla en el editor clásico.

Para añadir una imagen con Gutenberg, basta con arrastrar la imagen al editor y soltarla cuando aparezca una línea azul horizontal. Es más, si arrastras y sueltas varias imágenes a la vez, Gutenberg las añadirá automáticamente a un bloque de galería.

Arrastra y suelta imágenes desde tu ordenador.
Captura de pantalla

Bloquear un bloque para evitar que alguien lo cambie

Al bloquear un bloque, especialmente en ciertas páginas o publicaciones de alto contacto, comunicas fácilmente a los miembros de tu equipo que un determinado bloque no debe moverse ni eliminarse. Esto garantiza la coherencia de los bloques y le ahorra tiempo al rehacer los cambios que un miembro del equipo ha realizado en los bloques esenciales.

Seleccione el icono de tres puntos sobre el bloque que desea bloquear. Ahora, seleccione Bloquear.

Cómo bloquear un bloque.
Captura de pantalla

Después de esto, se le preguntará si desea simplemente deshabilitar el movimiento del bloque, evitar su eliminación o ambas cosas (bloquear todo).

Opciones para bloquear bloques en Gutenberg.
Captura de pantalla

Modifique sus preferencias para limpiar su panel de bloqueo

Después de seleccionar el icono de tres puntos en la esquina superior derecha, desplácese hacia abajo hasta Preferencias.

Configuración de preferencias en Gutenberg.
Captura de pantalla

Ahora puede cambiar sus preferencias generales, de bloque y de panel.

Aquí, hemos activado la opción mostrar los bloques más utilizados para que nuestros bloques de uso frecuente aparezcan primero. Esto le ahorra tiempo, por lo que no tiene que desplazarse por bloques que son irrelevantes para su sitio web cada vez que desee encontrar uno en particular.

Preferencias de bloqueo.
Captura de pantalla

Hacer uso de las vistas de lista y esquema

Una vez que hayas dominado los bloques básicos, es hora de empezar a utilizar estructuras de páginas web intrincadas. Para evitar que las cosas se compliquen demasiado, es posible que desee una instantánea de su documento que sea agradable a la vista.

Aquí es donde entran en juego las vistas de lista y esquema. Navegue hasta el icono de tres líneas a la derecha del botón de rehacer en la barra de herramientas superior. Verás que el atajo para esto es Shift+Alt+O.

Botón de resumen del documento.
Captura de pantalla

En la pestaña de esquema, puedes revisar fácilmente la estructura de las publicaciones de blog más largas y detectar errores de encabezado.

Vista de esquema
Captura de pantalla

Reflexiones finales: Cómo mejorar la eficiencia del flujo de trabajo utilizando el editor de bloques

Ahora que has aprendido a aprovechar los beneficios de Gutenberg para mejorar la eficiencia de tu flujo de trabajo, es posible que estés pensando en otras formas de modificar tu sitio web, como sumergirte en sus análisis o buscar formas de aumentar su velocidad.

En Bluehost, ofrecemos varios planes de alojamiento de WordPress que le brindan las herramientas que necesita para hacer precisamente eso, junto con varios otros complementos como un certificado SSL gratuito y copias de seguridad diarias del sitio web durante el primer año.

Y ahora, diseñar un sitio web llamativo es aún más fácil con WonderSuite. Cada uno de nuestros planes de WordPress viene con una serie de características adicionales que ayudarán a que tu sitio web brille.

Póngase en contacto con nosotros hoy mismo para obtener más información sobre cómo los planes de Bluehost pueden llevar el diseño y la funcionalidad de su sitio al siguiente nivel.

  • Minal es la Directora de Marketing de Marca de Bluehost. Con más de 15 años de experiencia empresarial en el sector tecnológico, se esfuerza por crear soluciones y contenidos que satisfagan las necesidades de los clientes. Es madre de un perro y rigurosa con el calendario.

Más información Directrices editoriales de Bluehost
Ver todos

Escriba un comentario

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