Editor de bloques de WordPress (Gutenberg): Guía completa para principiantes

La introducción del editor Gutenberg es el mayor cambio en WordPress desde su lanzamiento en 2003.

WordPress no se ha quedado quieto en ese tiempo, pero la mayoría de los cambios han sido más modestos y no tan drásticos.

Introducido en WordPress 5.0 lanzado allá por diciembre de 2018, el editor Gutenberg lleva un tiempo entre nosotros. Se ha mejorado constantemente y ahora compite mucho más de cerca con otros constructores de páginas de arrastrar y soltar como Elementor o Beaver Builder.

Gutenberg no es un constructor de páginas de arrastrar y soltar en el sentido más puro, pero es lo más parecido.

Si eres nuevo en el editor Gutenberg, este artículo te lo explicará todo.

Te guiaremos a través de todo el proceso de construcción de una página web utilizando Gutenberg. Primero crearemos una página, luego añadiremos un título, añadiremos algunos bloques de contenido, añadiremos imágenes y añadiremos algunos enlaces.

Luego incrustaremos un vídeo de YouTube, porque podemos, añadiremos algunos shortcodes para mostrarte cómo funcionan y añadiremos un botón que enlace la página a otro sitio.

También le mostraremos cómo crear una tabla, ya que en la versión antigua de WordPress este proceso siempre resultaba complicado.

A continuación, hablaremos de cómo editar bloques, organizarlos en grupos y diseños de columnas y crear bloques reutilizables para ahorrar tiempo al crear páginas.

Por último, publicaremos la página para que puedas ver los frutos de tu trabajo.

¿Qué es el editor de bloques de WordPress Gutenberg?

El editor de WordPress Gutenberg, Gutenberg, editor de bloques de WordPress o el editor de bloques, lo llames como lo llames, Gutenberg se introdujo en WordPress 5.0 allá por diciembre de 2018.

Es el nuevo constructor de páginas por defecto integrado en WordPress que hace más fácil que nunca construir páginas usando bloques.

Estos bloques de WordPress incluyen todo lo que se suele ver en una página web: párrafos, títulos, subtítulos, listas, imágenes, vídeos, widgets y mucho más.

Los bloques Gutenberg se parecen mucho a los Legos. Para construir una casa con Lego, hay que poner un bloque de puerta donde vaya la puerta, construir las paredes como se quiera, añadir bloques de ventana donde vayan las ventanas y añadir bloques de tejado para terminar.

WordPress es ahora lo mismo.

Añade un bloque de título donde iría el título, un bloque de contenido donde iría el contenido, añade bloques de imágenes y vídeo donde quieres que vayan los medios y así sucesivamente hasta que hayas construido una página web.

Gutenberg es un refrescante una forma sencilla de crear sitios web y abre el diseño de páginas a cualquiera con una idea creativa y algo de tiempo libre.

Diferencias entre el editor de Gutenberg y el editor clásico

El editor Gutenberg sustituye al antiguo editor de páginas y entradas basado en TinyMCE por una configuración basada en bloques.

En lugar de la antigua página con el menú superior por encima de la sección de contenido, donde tendría que escribir o pegar su contenido y añadir manualmente incrustaciones, código HTML y otros elementos de la página, ahora tiene bloques de WordPress que puede seleccionar y colocar en cualquier lugar de la página.

Algunas diferencias clave entre los dos sistemas son:

Arrastre y suelte bloques de contenido en cualquier lugar de la página

Este es probablemente el mayor cambio. En lugar de un espacio en blanco para añadir contenido en el antiguo editor, ahora empiezas con una página vacía y una selección de bloques que puedes seleccionar o arrastrar para añadir contenido.

Una vez que sepas dónde está cada cosa, te acostumbrarás rápidamente a añadir bloques a la página, añadir contenido a esos bloques y darles estilo para adaptarlos a tu tema.

Añadir e incrustar medios

Añadir e incrustar medios en el antiguo editor clásico era un engorro. Tenías que entrar en la vista Texto, encontrar el lugar de la página donde añadir el código de incrustación, pegar el código y volver a la pestaña Visual para ver cómo quedaba.

La incrustación no se adaptaría al diseño de la página y a menudo quedaría incómoda dentro de una página o requeriría algún ajuste para encajar cómodamente.

Ahora puedes buscar un bloque de incrustación, arrastrarlo a la página, pegar la URL del medio y ¡listo!

Bloques reutilizables

Los bloques reutilizables son otra ventaja del editor Gutenberg.

Por ejemplo, supongamos que desea utilizar la misma llamada a la acción (CTA) en todas las páginas. Desea utilizar un banner estrecho en un color diferente con una imagen, un botón y una CTA.

Con el editor clásico, tendría que crear el elemento CTA, copiar el código en un editor de texto y pegarlo en cada página. Después habría que ajustarlo para que encajara con el contenido de la página antes de que funcionara correctamente.

En el editor de Gutenberg, puedes crear un único CTA y guardarlo como un bloque reutilizable.

Los bloques reutilizables funcionan como plantillas en las que puedes seleccionarlos desde la barra lateral de bloques y colocarlos en cualquier lugar de tu sitio.

¡Tranquilo!

Cómo funciona el editor Gutenberg de WordPress

Si alguna vez ha utilizado un constructor de páginas como Elementor o Beaver BuilderGutenberg utiliza los mismos principios de arrastrar y soltar un bloque en la página y modificarlo in situ.

En lugar de tener que escribir o pegar contenido en una pantalla del editor y ajustarlo mediante HTML, ahora puede simplemente seleccionar un bloque, arrastrarlo a la página, añadir su contenido y personalizar el bloque para que se ajuste a su diseño.

Es tan sencillo que incluso alguien con poca experiencia podría literalmente instalar WordPress en un alojamiento web, instalar un tema y estar creando páginas y entradas en menos de 10 minutos.

Todo sobre los bloques

Hasta ahora hemos hablado mucho de los bloques en este artículo, pero tenga un poco de paciencia mientras los tratamos con un poco más de detalle.

En esencia, son elementos individuales de la página configurados como bloques autónomos. Puede seleccionar un bloque individual de una lista, arrastrarlo a la página, añadirle contenido y darle el estilo que desee.

WordPress incluye una amplia gama de bloques, pero los desarrolladores externos también han creado sus propios bloques, como el nuestro Spectra.

Hablaremos de Spectra para Gutenberg más adelante.

Todos los bloques se combinan para ofrecer una forma excepcionalmente sencilla de crear entradas y páginas sin necesidad de saber código, tener conocimientos de WordPress ni experiencia previa en la creación de sitios web.

Echa un vistazo a Magníficos temas gratuitos para WordPress compatibles con Gutenberg!

El nuevo editor de plantillas de WordPress 5.8

El equipo de WordPress ha estado trabajando duro para desarrollar las bondades introducidas con el editor Gutenberg. La última actualización es WordPress 5.8.

WordPress 5.8 introdujo Full Site Editing (FSE), el editor de widgets y theme.json, así como otras muchas mejoras.

Edición completa del sitio (FSE)

¿Recuerdas que dijimos en la introducción que Gutenberg no era un constructor de páginas completo de arrastrar y soltar como Elementor o Beaver Builder?

Esa brecha se estrecha aún más con la introducción de la Edición Completa del Sitio.

La idea es desarrollar Gutenberg lo suficiente para que puedas construir sitios web completos. Eso incluye navegación, cabecera, pie de página, barra lateral, widgets y todo lo que verías en una página web típica.

FSE es un proceso en el que los elementos se van introduciendo a medida que están listos. Tendrás que instalar un tema compatible como Veintiuna manzanas en este momento, pero las cosas se están desarrollando rápidamente.

Si quiere saber más sobre FSE, le recomendamos que conozca el editor de plantillas ya que es una herramienta disponible ahora mismo.

Editor de widgets

WordPress 5.8 nos trajo el editor de widgets basado en bloques. Se accede desde Apariencia > Personalice > WidgetsEste nuevo sistema le permite personalizar sus encabezados, pies de página y barras laterales del mismo modo que lo haría con sus entradas y páginas.

Los widgets existentes siguen ahí, pero ahora se llaman Widgets heredados.

El editor de widgets te permite utilizar los mismos principios del constructor de páginas en áreas que antes tenías menos controladas. Es un gran paso adelante en el diseño y en la apertura de WordPress para la edición completa del sitio.

Tema.json

WordPress 5.8 también nos presentó el archivo theme.json. Se trata de un nuevo archivo que permite personalizar el editor y los estilos de WordPress.

Se trata de un elemento más complejo de la nueva actualización y, para empezar, es probable que sólo resulte atractivo para desarrolladores o usuarios más experimentados, pero abre una gran oportunidad para controlar casi todos los elementos del aspecto y el funcionamiento de un sitio web y su editor.

Uso del editor de bloques de Gutenberg

Usar Gutenberg es muy sencillo. En este tutorial te mostraremos lo sencillo que es.

En primer lugar, veamos dónde está cada cosa en la página para que sepas dónde encontrarla.

Cuando se abre por primera vez una nueva página o entrada, verás un gran espacio en blanco que es el lienzo en blanco listo para que trabajes en él.

¿Ve el recuadro azul con un "+" en la parte superior izquierda? Selecciónelo para abrir el panel de bloque.

Aquí es donde se encuentran todos tus bloques.

Desplácese por la página para ver todos los bloques que tiene disponibles. WordPress incluye docenas de bloques e introduce más con cada actualización. Si utiliza plugins de bloqueo de terceros o temas compatibles con Gutenberg, es posible que veas aún más.

Hay seis secciones principales en las que encontrarás tus bloques:

• Texto - Bloques de texto, incluidos títulos, listas, citas, párrafos, código, pullquotes y otros.
• Medios de comunicación - Bloques multimedia que incluyen imágenes, galería, audio, portada, archivos, medios y texto y vídeo
• Diseño - Bloques que incluyen botones, columnas, grupos, separador de saltos de página, espaciador y otros
• Widgets - Bloques que incluyen shortcodes, calendario, categorías, HTML personalizado, RSS, últimas entradas, social y más
• Tema - Bloques temáticos: título de la entrada, contenido de la entrada, fecha de la entrada, extractos de la entrada, imágenes destacadas, etc.
• Incrustaciones - Bloques para incrustar YouTube, Twitter, SoundCloud, Spotify, Flickr, Vimeo y contenidos de otras plataformas.

Lo que veas exactamente en esta lista depende de tu tema de WordPress y de si tienes instalados plugins de bloqueo de terceros.

Por ejemplo, la sección Tema contendrá diferentes bloques de WordPress dependiendo del tema que utilice.

Si utiliza un complemento de bloque de Gutenberg como SpectraTambién verá secciones adicionales en la barra lateral en las que se describen todos los bloques añadidos por ese plugin en particular.

A la derecha de la página, verás una barra lateral familiar para la parte de publicación de WordPress. Es en gran medida la misma de siempre, con secciones para permalinks, imagen destacada, categorías, etc.

Un cambio que notará a la derecha es la nueva naturaleza dinámica de lo que ve. La columna cambiará en función del bloque que haya seleccionado en el centro.

Seleccione un bloque de contenido, por ejemplo, y verá el menú de tipografía con tamaños de fuente y ajustes.

Selecciona un bloque de imagen y verás que el menú cambia a controles de imagen.

Es una función menor pero muy útil.

1. Creación de una nueva página

La creación de una nueva página funciona de la misma manera que siempre.

1. Inicie sesión en WordPress para estar en el panel de control
2. Seleccione Páginas y el submenú Añadir nuevo

Ahora debería ver una página en gran parte en blanco con el menú lateral de WordPress y el nuevo menú a la derecha. Esta es la base para todo lo que vamos a hacer en esta guía.

También es el lienzo en blanco que vamos a utilizar para construir una página web totalmente funcional.

2. Añadir un título

Añadir un título suele ser una de las primeras cosas que hacemos al crear una nueva entrada o página, así que vamos a abordar eso primero.

Dado que los títulos son parte integral del funcionamiento de WordPress, el área de título ya está integrada en la página y se indica fácilmente con "Añadir título".

Escriba cualquier cosa en el área de título para dar título a su página.

3. Añadir nuevos bloques

Añadir un nuevo bloque usando el editor de Gutenberg es realmente fácil.

1. Seleccione el icono azul "+" situado en la parte superior izquierda y elija un bloque de la columna de bloques situada a la izquierda de la página.
2. Arrástrelo hasta la página principal y suéltelo

También puede seleccionar un área de la página con el cursor y, a continuación, seleccionar el bloque de la lista de bloques para que aparezca en la página.

También puede utilizar la barra diagonal y el nombre del bloque para añadir un nuevo bloque.

Por ejemplo, '/encabezado' resaltaría el bloque Encabezado, que puede seleccionar y añadir a la página.

Puedes seleccionar el recuadro negro "+" de la página para añadir bloques. Si seleccionas el cuadro negro, verás un menú emergente con una lista de bloques populares.

Seleccione el bloque que desee desde allí o seleccione Examinar todo para abrir la barra lateral de bloques y elegir desde allí.

4. Extracción de bloques

¿Ha añadido accidentalmente un bloque que no necesita? ¿Ha experimentado añadiendo y moviendo bloques y ahora quiere ordenarlos un poco?

Quitar bloques es casi tan fácil como añadirlos.

1. Seleccione el bloque que desea eliminar
2. Seleccione los tres puntos a la derecha del menú de bloques
3. Seleccione Eliminar bloque en la parte inferior.

También verás una combinación de teclas de acceso directo que puedes utilizar Ctrl + Alt +Z. Más adelante te proporcionaremos una lista de todas las teclas de acceso directo que conocemos.

Una vez que selecciones eliminar o utilizar el acceso directo, el bloqueo desaparecerá.

5. Añadir cabeceras mediante bloques

Nuestro siguiente paso al crear una página o entrada típica en WordPress es añadir un encabezado.

Los encabezados son vitales tanto para ayudar a los lectores a entender el contenido como para el SEO, así que añadamos uno.

1. Seleccione la casilla negra "+" situada bajo el título de la página
2. Seleccione el bloque Título
3. Escriba o pegue su encabezamiento en el nuevo bloque

Verá que el contenido se formatea automáticamente en H2. ¿Ves cómo el menú de la derecha ha cambiado para reflejar el bloque que estás utilizando?

Edición de cabeceras mediante bloques

Al añadir el encabezado, verás un pequeño menú emergente encima del bloque. Esto proporciona algunas opciones para personalizar ese bloque individual.

Puede cambiar el estilo, la posición, el tipo de encabezamiento, la alineación, poner el encabezamiento en negrita, cambiarlo a cursiva, añadir un enlace y hacer otros cambios.

Compruebe la pequeña flecha hacia abajo para ver más opciones.

6. Añadir imágenes mediante bloques

Ninguna entrada o página de WordPress estaría completa sin una o dos imágenes. Lo normal sería una imagen de cabecera y todas las imágenes que quieras incluir en el contenido.

Afortunadamente, añadir imágenes no puede ser más fácil.

1. Seleccione un bloque de imágenes de la lista y aparecerá en la página
2. Seleccione el botón azul Cargar en el nuevo bloque para añadir una imagen. También puedes seleccionar el enlace Biblioteca multimedia para añadirla desde tu biblioteca multimedia de WordPress o Insertar desde URL para copiarla desde otro lugar.

Puedes añadir rápidamente texto alternativo a la imagen en el menú de imágenes situado a la derecha de la página. Aquí también puedes ajustar rápidamente el tamaño y el estilo de la imagen.

Edición de imágenes con bloques

Al añadir la imagen, verás el ya familiar menú emergente encima del bloque de imagen con unas cuantas opciones.

Aquí puedes cambiar el bloque, añadir una URL, recortar, añadir texto, añadir efectos y cambiar la imagen.

7. Cómo añadir contenido escrito mediante el editor Gutenberg

Añadir contenido en el editor Gutenberg es igual de sencillo. Puedes simplemente escribir o pegar en el espacio de la página o añadir un bloque de párrafo para mantener las cosas ordenadas.

Recomendamos la segunda opción, ya que facilita la edición posterior.

1. Seleccione el botón negro "+" de la página
2. Seleccione el bloque Párrafo en el menú desplegable
3. Escriba o pegue su contenido en el bloque

Edición de contenido escrito con el editor Gutenberg

La edición de contenidos escritos utiliza los mismos principios que los demás bloques que ha añadido hasta ahora.

Consulte el menú emergente para ver las opciones. Incluyen cambiar el bloque, reordenar su posición, cambiar la alineación, añadir negrita, cursiva o URL con esas otras opciones bajo la flecha hacia abajo.

8. Añadir un enlace en el editor de bloques

Los enlaces son fundamentales para el funcionamiento de los sitios web, por lo que son el siguiente paso lógico en nuestro proceso de creación de páginas.

1. Seleccione el contenido que ha añadido donde desea añadir la URL
2. Seleccione el icono de enlace en el menú de edición situado encima del bloque
3. Escriba o pegue su enlace en la casilla URL que aparece
4. Compruebe la URL en el cuadro de vista previa situado debajo de
5. Seleccione si desea abrir en una pestaña nueva o no
6. Seleccione la casilla URL situada junto a la vista previa para insertar el enlace o el icono de retorno situado a la derecha del enlace que ha pegado

Añadir enlaces es probablemente la menos intuitiva de todas las mejoras del editor Gutenberg. No está claro que haya que seleccionar el cuadro de URL o el enlace de retorno para añadirlo.

Si no lo haces, el enlace se cae y tienes que volver a empezar.

Editar un enlace en el editor de bloques

Es comprensible que las opciones de edición de enlaces sean limitadas.

Selecciona el enlace y aparecerá el menú emergente. Aquí puedes cambiar la URL, cambiar si se abre en una página nueva o no y eso es todo.

9. Insertar un vídeo de YouTube

Para incrustar un vídeo de YouTube solía ser necesario pegar el código en la vista de código del antiguo editor clásico. Ahora es mucho más fácil.

1. Abra la barra lateral de bloques y desplácese hasta Embeds
2. Seleccione el bloque de YouTube para insertarlo en la página
3. Pega la URL de YouTube donde se indica
4. Seleccione el botón azul Incrustar

El vídeo debe aparecer en el bloque con la imagen principal y un botón de reproducción.

Editar un bloque de vídeo de YouTube

Las opciones de edición dentro de un bloque de vídeo de YouTube se limitan a cambiar el tipo de bloque, cambiar la alineación y cambiar la URL del vídeo.

10. Cómo añadir códigos cortos con Gutenberg

Añadir shortcodes es otra de las cosas que puede encontrarse ocasionalmente al crear un sitio web.

Los códigos cortos se utilizan a menudo para insertar elementos en una página que no tienen widgets u otros métodos de inserción.

Por ejemplo, los formularios se insertan a menudo en las páginas utilizando shortcodes, ya que es más fácil que construir un bloque para ellos.

1. Para añadir un shortcode, seleccione el '+' azul o negro para abrir la barra lateral de bloques
2. Seleccione el bloque Shortcode de la sección Widgets
3. Pega tu shortcode en el recuadro

No hay mucho más que puedas, o necesites, hacer con un bloque shortcode. Tampoco es necesario editar mucho.

11. Añadir un botón a entradas y páginas

Añadir un botón utilizando un bloque es otro de los elementos menos intuitivos de Gutenberg, pero sigue siendo bastante fácil.

1. Seleccione el bloque Botones en el área Diseño de la barra lateral de bloques
2. Escriba la sintaxis que desee para el botón en el área blanca del bloque de botones
3. Seleccione el estilo del botón en el menú de edición situado encima del bloque
4. Añada la URL del botón desde el menú de edición situado encima del bloque
5. Estiliza el texto de la misma manera y ¡listo!

12. Creación de tablas

Es poco probable que necesite añadir tablas a una entrada o página de WordPress, pero puede haber ocasiones en las que sí.

Como ya habrás adivinado, hay un bloque para eso.

1. Seleccione el bloque Tabla en la barra lateral de bloques
2. Selecciona cuántas columnas y filas quieres en tu tabla desde las opciones
3. Seleccione Crear tabla cuando esté listo

Ahora debería ver aparecer la tabla en el bloque con un contorno gris para la navegación

Añada las entradas de la tabla en las casillas correspondientes

Edición de tablas

La edición de tablas es muy sencilla.

Seleccione su opción de edición en el menú situado encima de la tabla dentro del bloque. La mayoría de los controles estarán dentro de la opción 'Editar tabla'.

13. Disposición de bloques en columnas

Hasta ahora, hemos creado una página bastante lineal con una sola columna central. Pero, ¿y si quisieras más columnas?

Lo has adivinado, ¡hay un bloque para eso!

1. Seleccione una ubicación en la página para añadir sus columnas y seleccione el botón azul o negro "+" para abrir la barra lateral de bloques.
2. Seleccione el bloque Columnas en la sección Diseño
3. Seleccione el número de columnas del nuevo bloque
4. Añadir un bloque individual a cada columna

Edición de bloques en columnas

Cuando utilizas columnas, esencialmente estás dividiendo tu página en tres dentro de un elemento padre.

Esto te da cuatro bloques que puedes editar y tus opciones cambian dinámicamente dependiendo de los bloques que añadas.

Por ejemplo, si añades un contenido, podrás editarlo de la forma habitual. Si añades una imagen, tendrás una mezcla de herramientas de edición de contenidos e imágenes.

14. Incrustación con Gutenberg

La incrustación en WordPress solía implicar cortar y pegar código en la vista de código de una página o entrada. Solía funcionar bastante bien, pero podía suponer un reto cuando se intentaba encajar la incrustación en un diseño.

Incrustar usando Gutenberg es ahora sencillo ya que ahora tienes una serie de bloques específicos para incrustar.

1. Seleccione el icono azul o negro "+" para acceder a la barra lateral de bloques
2. Desplácese hasta Embeds
3. Seleccione en la lista la incrustación que busca
4. Introduzca la URL o el código de la fuente en el bloque de incrustación
5. Confirma los ajustes, pulsa Incrustar y deberías ver la fuente aparecer en el post o página dentro del bloque.

Si no ves un bloque específico para tu incrustación, utiliza el bloque Incrustar. Este es un bloque genérico que te permite pegar casi cualquier URL en WordPress usando el mismo proceso anterior.

15. Guardar y reutilizar bloques en Gutenberg

El editor Gutenberg ahora utiliza lo que se conoce como bloques reutilizables. Se trata de plantillas que puedes crear y reutilizar en cualquier parte de tu sitio web.

Como ejemplo, digamos que creas un bloque de llamada a la acción. Podrías añadir una imagen, un botón, una copia de la llamada a la acción y guardarlo como un bloque reutilizable.

A continuación, puedes seleccionar ese bloque en la barra lateral de bloques y utilizarlo tantas veces como quieras, en cualquier página o entrada que desees. Esto te ahorrará mucho tiempo.

Vamos a crear un simple bloque reutilizable en Gutenberg.

Seleccione una posición y un bloque a utilizar. Hemos utilizado el bloque Llamada a la acción de Spectra para Gutenberg. Puedes usar el que más te guste.

1. Cree y edite el bloque como lo haría normalmente
2. Seleccione la opción de tres puntos en el menú de edición
3. Seleccione Añadir a bloques reutilizables
4. Pon un nombre significativo a tu bloque

Una vez que hayas nombrado el bloque, deberías ver que su nombre cambia en el menú de edición situado encima. Si abres la barra lateral de bloques, verás que aparece una nueva pestaña en la parte superior llamada "Bloques reutilizables".

Mira dentro de esta pestaña y verás tu nuevo bloque.

Ahora puede seleccionar y utilizar ese bloque en cualquier lugar de su sitio web siguiendo el mismo proceso que para añadir cualquier otro bloque. ¿No es genial?

16. Publicación mediante el editor de bloques Gutenberg

Publicar una página o post usando Gutenberg es en gran medida lo mismo de siempre. Sin embargo, hay un paso adicional.

El botón azul Publicar de la parte superior derecha de la página sigue ahí, pero en lugar de pulsarlo una vez para publicar la página, tendrás que pulsarlo una vez y luego otra para confirmar.

Por lo demás, el proceso de publicación es igual de sencillo que siempre.

Si está editando una página publicada, verá Actualizar en lugar de Guardar, pero el resultado final es el mismo.

Atajos de teclado para Gutenberg

La nueva interfaz de usuario de WordPress es muy sencilla y hace que sea fácil encontrar lo que buscas, pero si eres un fan de los atajos de teclado, esta sección es para ti.

Puedes ver todos los atajos disponibles seleccionando el icono de menú de tres puntos situado en la parte superior derecha de cualquier página o pantalla de entrada. Selecciona Atajos de teclado de la lista para verlos todos.

También hay un atajo para acceder a los atajos de teclado, Mayúsculas + Alt + M.

A continuación, verás un panel completo con todos los posibles atajos de teclado que puedes utilizar mientras construyes con Gutenberg.

Ampliación de Gutenberg

Hay una amplia gama de plugins que pueden ampliar el editor Gutenberg de WordPress. Uno de ellos es nuestro Spectra para Gutenberg.

Este plugin utiliza la misma filosofía que nuestro Tema Astra y nuestros otros temas y productos de WordPress. Es fácil de usar, simplifica el diseño web, permite crear hermosos sitios web sin tener que codificar y pone potentes herramientas en manos de todo el mundo.

Spectra añade una serie de bloques, entre los que se incluyen:

• Cuadro de información
• Rúbrica avanzada
• Disposición de los puestos
• Miembros del equipo
• Listas de precios
• Participación social
• Testimonio
• Clasificación por estrellas
• Y muchos más...

Spectra para Gutenberg es gratuito y funciona con todas las versiones recientes de WordPress.

Pruébalo y vea todo lo que puede hacer.

Alternativas al editor de bloques Gutenberg de WordPress

A la hora de personalizar tu sitio web, tienes muchas opciones entre las que elegir. Hay editores de texto WYSIWYG (lo que ves es lo que obtienes), constructores de páginas de arrastrar y soltar y herramientas de edición visual. 

Siempre hay un plugin de WordPress disponible para lograr o habilitar la funcionalidad en su sitio web, ya sea el front-end o el back-end. 

Es simplemente una cuestión de lo que mejor se adapte a su sitio web. 

Aquí hemos enumerado algunas de las mejores alternativas al editor de bloques Gutenberg disponibles en la actualidad:

Elementor

Elementor es la opción más barata para crear un sitio web. Su versión gratuita es una de las mejores del mercado. Tiene menos funciones que la versión premium, pero permite crear un sitio web bonito simplemente arrastrando y soltando. 

Es un potente constructor de páginas de WordPress que simplifica la personalización de sitios web y la creación de contenidos. Con más de cuatro millones de instalaciones activas, Elementor es el constructor de páginas más popular. 

Ofrece una interfaz fácil de usar y un conjunto avanzado de funciones, lo que la convierte en una opción preferible para todo el mundo.

Beaver Builder

Beaver Builder es la mejor opción si eres un principiante aprendiendo a construir y personalizar sitios web de WordPress. Se estima que este constructor de páginas tiene más de 500.000 usuarios y más de un millón de instalaciones activas.

El constructor de páginas es sencillo y fácil de usar. Está construido por una antigua agencia de construcción web WordPress con el objetivo de hacer sitios web rápidos y eficientes para sus clientes. 

Beaver Builder cuenta con un editor en tiempo real que le permite ver cómo quedarán los cambios a medida que los realiza sin tener que actualizar la página. 

Cuenta con una impresionante biblioteca de plantillas adaptables y personalizables que puedes importar a tu sitio web en unos pocos clics. Los creadores de páginas presentan un código limpio y te ayudan a crear sitios web compatibles con SEO.

Visual Composer

Visual Composer es un constructor de páginas de arrastrar y soltar que te permite crear páginas y entradas personalizadas sin ningún conocimiento de codificación. Puedes añadir fácilmente texto, imágenes, botones, audio y otros elementos al diseño de tu página en unos pocos clics. 

Ofrece una amplia biblioteca de plantillas prediseñadas y módulos que le ayudan a acelerar su flujo de trabajo. Visual Composer es ideal para principiantes y profesionales experimentados. 

El constructor de páginas es una gran herramienta para crear sitios web impresionantes. Es fácil de usar y tiene muchas características que le permiten personalizar sus páginas a la perfección.

Preguntas frecuentes sobre el editor Gutenberg de WordPress

Tienes alguna pregunta sobre el editor Gutenberg de WordPress? Aquí tienes algunas respuestas a preguntas comunes sobre Gutenberg.

El editor Gutenberg

Como puedes ver, aunque hay muchas cosas que hacer con el editor Gutenberg, es sencillo de entender y muy fácil de usar. También es el futuro de WordPress, lo que te da una idea de con qué trabajarás en un futuro próximo.

Aunque el cambio puede ser difícil para algunos, creemos que el editor Gutenberg es un paso en la dirección correcta.

Democratiza el diseño web y pone algunas herramientas potentes en manos de todos. Y lo que es más, esas herramientas no necesitan conocimientos previos de diseño web o codificación.

Creemos que este es el caso más sólido posible para utilizar el editor Gutenberg y pensamos que todo el mundo debería probarlo.

¿Qué opinas del editor Gutenberg? ¿Te disgustaba al principio pero ahora te encanta? ¿Sigues indeciso? ¿Sigues usando el antiguo editor TinyMCE? Cuéntanos lo que piensas a continuación.