Cómo crear una página de blog con Gutenberg (basado en el tema de Gutenberry)

Publicado: 2019-10-31

En este tutorial, encontrará todo lo que necesita para crear una página de blog con el editor Gutenberg y el tema GutenBerry.

Creando una página de blog con Gutenberg

Una página de Blog es una página donde sus visitantes ven todas las publicaciones existentes en su sitio web. Es una página dinámica, es decir, muestra las publicaciones agregadas en su sitio desde las más recientes hasta las primeras, ordenándolas por fecha.

Es importante saber que, en este momento, puede diseñar la forma en que se muestran las publicaciones, sin embargo, el extracto de la publicación, la imagen destacada, el meta y el título de la publicación se extraerán de la publicación.

Debe asegurarse de que haya publicaciones en su sitio y de haber configurado la imagen destacada y toda la información que desea mostrar en la página del Blog en la lista de Publicaciones de antemano.

Para crear una página de Blog en su sitio web, debe ir a Páginas> Agregar nuevo, ¡y aquí vamos!
En primer lugar, debes elegir el nombre de tu página. Lo llamaremos "Mi primera página de blog", pero el nombre de su página debe ser una pequeña introducción.

Puede llenar la página con el bloque clásico de Publicaciones de Gutenberg. Sin embargo, si desea ahorrar tiempo y obtener más configuraciones adicionales para personalizar su página de Blog, puede usar el complemento ZeGuten. Tiene 5 diseños de publicaciones receptivos para hacer que su página sea más atractiva y atractiva.

creando una publicación

Creando una página de blog basada en Gutenberry

Una vez que haya creado una página de Blog, puede navegar a Panel de control> Configuración> Lectura y aquí ubicar el menú desplegable de la página Publicaciones. Especifique la página que acaba de crear y presione el botón Guardar cambios.

¡Felicitaciones! Ahora ha asignado la página recién creada como su página de Blog. Sin embargo, todavía hay muchas formas de personalizarlo y hacerlo único.

Abra la página Blog recién creada en el Personalizador y acceda a la pestaña Configuración del blog, luego vaya a la pestaña Blog para ver qué puede hacer.

personalizar blog

De forma predeterminada, lo más probable es que vea todas las publicaciones de su sitio como una lista. Para cambiar la forma en que se muestran las publicaciones, utilice:

Diseño Tipo de blog: aquí puede elegir un diseño del menú desplegable para que sus publicaciones se muestren como una cuadrícula.

Columnas: cuando haya configurado un diseño de cuadrícula para su blog, verá el menú desplegable para elegir la cantidad de columnas en las que se mostrarán las publicaciones.

configuración del blog

También están las configuraciones que lo ayudarán a decidir qué metadatos para las publicaciones desea mostrar: autor de la publicación, fecha de publicación, categorías, etiquetas, recuento de comentarios, etc.

La última casilla de verificación le permite permitir que se muestren los extractos de las publicaciones.

Habilite el botón Mostrar Leer más para permitir que los visitantes hagan clic en él y naveguen a la página de publicación única.

Además, tendría que configurar el tipo de etiqueta adhesiva para marcar sus publicaciones como adhesivas si las hay.

Habilitación de la navegación para la página del blog

Cuando tienes muchas publicaciones en tu sitio (sí, eres un bloguero, seguro que las tienes) sabes lo incómodo que se puede sentir el visitante cuando necesita desplazarse hacia abajo en la página mientras busca una publicación en particular que has publicado hace algún tiempo.

Para facilitar el proceso, puede agregar un tipo de navegación a la página del Blog. Puede ser una opción que permita ir de una página a otra, o flechas de navegación.

Mientras está en el Personalizador, puede cambiar el tipo de navegación que se utilizará para la página del Blog en el menú desplegable Tipo de navegación.

otras configuraciones de blog

Aquí puede elegir entre Paginación o Navegación.

Si no ve ningún elemento de paginación, esto significa que aún debe establecer la cantidad de publicaciones que se mostrarán por página.

Vaya a Panel de control> Configuración> Lectura y defina el valor máximo de las páginas del blog (debe ser menor que la cantidad de publicaciones que tiene para que pueda ver la opción de paginación).

establecer número de publicaciones

En la mayoría de los casos, esto será suficiente para crear una página de blog. Sin embargo, si desea crear una página estática con un listado de publicaciones dinámicas, puede hacerlo en Gutenberg. Sigue leyendo para aprender cómo.

Creando una página de blog estática con contenido dinámico usando Gutenberg

Una vez más deberías crear una nueva página. Y ahora estamos comenzando.

¡Agreguemos el bloque Publicaciones al lienzo de la página! Simplemente haga clic en el icono "+" que se ve a la izquierda del texto "Comenzar a escribir o escriba / para elegir un bloque". Elija el bloque llamado "Publicaciones": puede ubicarlo en la categoría de bloques ZeGuten.

Ahora puede ver que el bloque de Publicaciones muestra las publicaciones que tiene en su sitio usando la configuración predeterminada. Modifiquémoslos un poco para obtener mejores resultados.

Por cierto, puede utilizar fácilmente los amortiguadores cortos de Gutenberg para acelerar su trabajo. Si no sabe cómo usar los atajos de teclado, no dude en leer esta guía.

Publicaciones bloquean la configuración. Configuración del diseño de las publicaciones en Gutenberg

Establezcamos todas las configuraciones necesarias para trabajar con el diseño del diseño de las publicaciones y el contenido que desea extraer de sus publicaciones para mostrarlo en el blog. Afortunadamente, en el editor de Gutenberg, puede hacer todo lo que necesita mientras usa el bloque de publicaciones. No le llevará más de varios minutos.

Bloque de publicaciones: opciones de diseño

elegir diseño

Busque la barra de configuración de Bloque a la derecha del lienzo de la página. Si no lo ve, significa que lo ha cerrado previamente. Para recuperarlo, haga clic en el icono de la rueda dentada en la esquina superior derecha. Luego haga clic en el bloque Publicaciones en el lienzo para activarlo y acceder a su configuración.

El bloque de Publicaciones permite elegir entre 3 opciones de diseño diferentes:

  • Lista de publicaciones: es un diseño limpio en el que las publicaciones se organizan una por una en una columna;
  • Cuadrícula de publicaciones: un diseño en el que puede mostrar publicaciones en varias columnas y filas, configurando la cuadrícula para mostrar publicaciones;
  • Lista de publicaciones desiguales: use este diseño para organizar las publicaciones en el orden del ajedrez. Aquí tendrá una columna, y las publicaciones se muestran una por una en una forma de lista con las filas pares que muestran la imagen destacada a la izquierda y desiguales a la derecha.

Abra la Configuración de publicación a continuación para elegir las publicaciones que le gustaría extraer usando este bloque.

establecer ajustes

Aquí puede configurar:

  • Categoría: la categoría de la que desea mostrar las publicaciones.
  • Número de elementos: limite las publicaciones a un número determinado y no muestre más de un número determinado. El máximo es de 100 publicaciones, pero ciertamente puede usar la configuración de Leer más para que el bloque parezca más corto.
  • Columnas: use este interruptor para establecer el número de columnas para su diseño de cuadrícula. El número máximo de columnas es 6.
  • Seleccionar etiqueta de título: aquí puede configurar la etiqueta html que se utilizará para el título (H1 - H6). Asegúrese de que su título esté configurado correctamente para que ocupe un lugar más alto en los resultados de búsqueda.
  • Ordenar por: esta opción permite ordenar las publicaciones de la más antigua a la más reciente, de la más reciente a la más antigua, y usar el orden alfabético para establecer un orden.

También hay opciones para:

  • mostrar imágenes destacadas: debe asegurarse de haber configurado imágenes destacadas en sus publicaciones para poder verlas;
  • mostrar la fecha de publicación: una opción para mostrar la fecha en la que se publicó la publicación;
  • mostrar la categoría de la publicación: esto permitirá al visitante ver a qué categoría está relacionada la publicación;
  • mostrar extracto de publicación: habilite esta opción para mostrar un extracto de su publicación (puede ser uno personalizado o un extracto generado a partir de su contenido), también podrá establecer la longitud del contenido del extracto recortando el número de palabras;
  • mostrar autor de la publicación: habilite este interruptor para mostrar quién ha escrito esta publicación.

Leer más configuraciones

Siempre que desee que los visitantes abran sus publicaciones y procedan a leer, podrá mostrar un enlace Leer más y personalizar cómo se muestra, reemplazar el texto predeterminado por el suyo, etc.

Lee mas

También podrá decidir si desea mostrar la opción Leer más para cada publicación como un texto o como un botón.

El bloque de publicaciones es bueno para trabajar con publicaciones dinámicas, pero aún no permite disfrutar de toda la potencia de las consultas personalizadas. Sin embargo, será un activo incomparable al trabajar con las páginas estáticas de su sitio web de blogs.

Tenga en cuenta que todavía no hay opciones de paginación, por lo que si desea mostrar todas sus publicaciones, deberá establecer el número de publicaciones al máximo. También puede asignar la página recién creada como la página principal de su blog en la Configuración, o puede mantener las cosas como están y hacer que se muestre como su blog solo en el menú (donde debe vincularlo), mientras mantiene el Blog página como archivo de publicaciones.

La otra forma de abordar esta tarea es agregar un enlace a la página de archivo de publicaciones (un Blog real que ha creado en la primera parte de este tutorial) al final de la lista de publicaciones para permitir que los visitantes accedan a todas las publicaciones.

¡Felicitaciones! ¡Has creado y diseñado tu primera página de blog propia! ¡Suscríbase a nuestro boletín para obtener aún más consejos sobre cómo trabajar con Gutenberg y Gutenberry!