Tutorial para Gutenberg

Tutorial para Gutenberg

¿Como se usa Gutenberg?

Hace un par de semanas hablamos del nuevo editor de textos de WordPress que ha venido para quedarse (si te lo perdiste, pincha aquí). Ahora os traemos un pequeño tutorial para Gutenberg explicando sus aspectos principales.

¿Bloques? ¿Qué es eso y como se usa?

Como ya hablamos, en el nuevo editor de textos trabajaremos con bloques, como los editores visuales más usados en WordPress. Los bloques son elementos de construcción, los cuales tendrán una finalidad concreta. En la parte superior izquierda tenemos el icono con el podremos añadir nuevos bloques. También podemos añadirlos desde la parte central de la página.

tutorial gutenberg añadir bloque

Al pinchar en el icono de añadir bloque, se nos despliega un menú de selección donde podremos elegir el bloque que necesitamos. Tenemos multitud de bloques para elegir, incluso un buscador para encontrar el bloque que necesitamos rápidamente.

bloques tutorial gutenberg Tenemos los bloques más usados como el de encabezados, listas, añadir imágenes… Pero tenemos otros nuevos como el de “imagen de fondo”, bloque que nos permite colocar un texto destacado con una imagen de fondo a la que podemos dar más o menos opacidad. Este tipo de bloques nuevos darán un empujón estético que hará más atractivas nuestras páginas y post.

Junto con los bloques más usados y los comunes, tenemos nuevos bloques como;

· Formatos; En este grupo de bloques podemos volver al editor original, añadir texto html o añadir código.
· Elementos de diseño; Aquí encontramos elementos como botones, columnas (esto antes teníamos que hacerlo añadiendo código a       mano, pero ahora lo tenemos más fácil)
· Widgets; Shortcodes, productos de la tienda, categorias… todo lo que podemos usar con los widgets.
· Incrustados; Los iframes de siempre ahora en un clic. Con estas opciones podemos añadir nuestras redes sociales en cualquier                página o post de nuestra web.

Los más avispados os habréis dado cuenta de que mucha de estas opciones ya las teníamos antes o ya se podían hacer conociendo un poco de código. Lo que no propone Gutenberg es tener todas esas opciones y muchas más a un solo clic.

Ahora que ya sabemos como añadir un bloque, toca ver como podemos configurarlos seguún nuestras necesidades. Cada bloque tendrá sus caracteristicas particulares, por ejemplo, en bloque de encabezados tiene las opciones de elegir entre H1, H2, H3 y H4 en su parte de configuración principal. Luego tiene las opciones de configuración generales como “redituar como HTML”, “Duplicar”, “Añadir a los bloques reutilizables” y “quitar bloque”.

La parte derecha de nuestro editor de texto también será nueva. Donde antes teníamos la configuración de publicación, el botón de publicar o actualizar, el selector de categorías, etc… ahora tenemos ¡¡lo mismo!! Pero con mejor diseño y con más opciones;

barra lateral tutorial gutenberg

Los botones de publicar, actualizar o vista previa han tomado más protagonismo colocándose en la parte superior de la página y estando siempre presente aunque hagamos scroll en la página.

Las opciones de visibilidad, fecha de publicación y formato son administrables con un solo clic. Al igual que las opciones de colocar el post en portada de forma permanente o tenerlo pendiente de revisión. El resto de especificaciones del post/pagina los tenemos en forma de menús desplegables para tenerlos más a mano y no tener que hacer un scroll casi infinito para administrar todas las características.

Destacamos que tenemos una nueva opción de “Extracto”, donde controlaremos lo que se previsualizará de nuestro post o página antes de entrar. Siempre sumando para potenciar el SEO. Esta parte, si usamos algún plugin de posicionamiento como puede ser Yoast SEO (¿no lo conoces? pincha aquí) puede que nos de un poco igual porque ya colocamos el extracto en el plugin de SEO, pero no viene mal que tengamos esta opción por defecto.

También podemos controlar los comentarios, desactivando la opción de comentar los post y páginas o los pingbacks y trackbacks.

Al igual que con los bloques, Gutenberg lo que busca es facilitarnos el trabajo y hacerlo todo mucho más intuitivo, llevando más a la mano temas como controlar el SEO de nuestros post/páginas y haciendo el trabajo más fácil.

Esta barra lateral, si os fijáis en la parte superior, tenemos una opción de “bloque”. En esta parte, con el bloque seleccionado, descubriremos opciones de configuraciones adicionales que amplían las que ya teníamos en el propio bloque y que nos dan una capacidad de personalización mayor.

 





¿TE HA GUSTADO ESTE ARTÍCULO?

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

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.