La plantilla Astra dispone de bastantes y muy interesantes opciones para el diseño del blog con WordPress.
En este post nos vamos a centrar en las opciones relacionadas con el listado de entradas de blog de que dispone Astra. Es decir, página principal del blog y páginas de categorías.
DISFRUTA DE TODOS MIS CURSOS PREMIUM POR SOLO 10€/MES
ÍNDICE PERSONALIZAR BLOG DE ASTRA PRO
1.- Opciones de Astra para listas de posts y para post individual
Las opciones de personalización de la plantilla Astra en lo que se refiere al diseño del blog se clasifican en dos subcategorías:
- i.- Blog / Archivo: esta subcategoría la encontramos en: “Apariencia > Personalizar > Blog > Blog / Archivo” y sirve para personalizar el diseño de las listas de entradas. Es decir, afecta a la página principal del blog asociada desde los ajustes de wordpress y a las páginas de categorías. En este apartado nos vamos a centrar en este post.
- ii.- Entrada individual: sirve para el diseño de las entradas o posts individuales utilizando la plantilla Astra.
Todo esto y mucho más lo puedes ver en mi curso de Astra
QUIERO ASTRA PRO
2.- Opciones de Astra para la personalización del blog de wordpress (Blog / Archivo)
Para acceder a estas opciones de la plantilla Astra, iremos a: “Apariencia > Personalizar > Blog > Blog / Archivo”. Desde aquí podremos personalizar el diseño de las listas de entradas. Es decir, la apariencia de la página principal del blog de WordPress y de las categorías del blog.
2.1.- Estructura del blog Astra y categorías
Vamos a ir viendo en primer lugar todas las opciones estructurales del blog.
i.- Diseño: podemos elegir entre 3 diseños diferentes de entrada en lista. De izquierda a derecha tenemos las siguientes opciones:
a.- Imagen arriba: en este diseño de Astra, la imagen destacada del post quedaría arriba y el título + datos meta + extracto quedarían abajo. Todos centrados.
b.- Imagen derecha: la imagen destacada quedaría a la derecha y los textos a la izquierda.
c.- Imagen izquierda: la imagen destacada quedaría a la izquierda y los textos a la derecha.
ii.- Diseño de cuadrícula: Esta opción solo se mostrará si seleccionamos el diseño de imagen arriba y texto abajo. Desde aquí estableceremos el número de columnas que queremos que se muestren en el blog. Podremos elegir entre 1- 4 columnas. Los posts de blog se mostrarán en modo rejilla en las diferentes columnas que establezcamos.
Opciones diseño blog Astra
iii.- Opciones diseño : Según el diseño que hayamos elegido se nos mostrarán más o menos opciones complementarias, a través de checkbox. Entre las que destacan:
a.- Añadir espacio entre entradas: convierte cada post en una caja y añade un espacio vertical y horizontal entre entradas consecutivas.
b.- Diseño de empedrado: diseño en modo rejilla o retícula. Pero, en el que no se guarda el arranque de cada fila de entradas. Es decir, se guarda la rejilla regular en vertical pero no en horizontal.
c.- Resaltar la primera entrada: esta opción de Astra sirve para destacar en tamaño la entrada más reciente entre las que se listan.
d.- Activar recuadro de fecha: con esta opción mostraremos en la imagen destacada de cada post una figura con la fecha en su interior
e.- estilo del recuadro de fecha: la figura donde se muestra la fecha inscrita puede ser cuadrada o circular.
f.- Eliminar relleno de la imagen destacada: con esta opción de Astra, lo que haremos será ajustar la imagen destacada de cada post al espacio disponible de su contenedor. Es decir, no habrá ningún margen o marco en torno a la imagen.
iv.- Estructura de entrada: desde este apartado podremos gestionar la visibilidad de la imagen destacada y texto (podemos ocultar). También podremos cambiar la posición entre ambos.
vi.- Sección Meta: muy similar al anterior. Pero ahora podremos gestionar la visibilidad y posición de las opciones meta asociadas al post.
mostrar y ocultar elementos del post con Astra y WordPress
vii.- Ancho del contenido: desde este apartado podremos personalizar la anchura dispuesta para mostrar las entradas de blog. Podemos heredar la configuración establecida de manera general para este contenedor o establecer un ajuste personalizado.
viii.- Contenido de la entrada: con esta opción de Astra podremos mostrar un extracto del post (lo habitual) o el post completo (nada habitual)
ix.- Número de extracto: con esta opción estableceremos el número máximo de palabras a mostrar en el extracto de las entradas de blog. El extracto es el texto resumen que se muestra asociado a cada entrada de blog cuando se muestran en una lista.
x.- Texto <<leer más>>: en este campo podremos personalizar el anchor text del enlace bajo el extracto que lleva al post individual.
Debajo, tenemos un checkbox que nos permite mostrar en enlace de “leer más” como un botón en vez de un enlace sencillo.
xi.- Tamaño de imagen destacada: desde esta opción podríamos establece un ajuste personalizado para el tamaño de la imagen destacada asociada a las entradas.
xii.- Paginación de entrada: cuando se muestran muchas entradas en una página, tenemos 2 opciones fundamentales:
a.- Paginación (número): al final de la página se muestran unos números para ir navegando por las diferentes páginas de entradas.
Más abajo tenemos una opción para personalizar el aspecto de esta paginación. Podremos elegir entre: predeterminado, cuadrado y circular.
b.- Scroll infinito (desplazamiento infinito): en una misma página se muestran TODAS las entradas. Pero, estas se van cargando por bloques conforme vamos realizando scroll.
xiii.- Espacio de paginación de entrada: margen alrededor del bloque de paginación que aparece en la parte inferior de la página.
QUIERO ASTRA PRO
2.2.- Colores, fondo, tipografía y espaciado del blog con Astra.
Vamos a ver ahora los apartados relacionados con el diseño de colores y tipografías del blog con la plantilla Astra.
2.2.1.- Colores y fondo blog Astra
En el apartado de “Colores y fondo” encontramos la opción de “Contenido”, donde podremos personalizar aspectos como:
- a.- color del título de la entrada
- b.- color elementos “meta” tipo texto
- c.- color elementos “meta” tipo enlace
- d.- color de fondo del título de la categoría del blog o título de la página
- e.- color del título anterior
- f.- color de descripción (en caso de que se muestre una descripción bajo el título de la página)
- g.- color hover enlaces meta: es decir, color al poner el ratón sobre algún enlace meta.
2.2.2.- Tipografía blog Astra Pro.
En este apartado podremos establecer aspectos como: tipo de fuente, tamaño de fuente, grosor fuente, transformaciones y altura de línea.
Estas opciones de personalización las podremos realizar sobre elementos como:
- a.- Título de la página (título página categorías)
- b.- Título de la entrada
- c.- Elementos meta de la entrada
- d.- Elementos de la paginación
2.2.3.- Espaciado blog Astra
Finalmente, disponemos de una serie de opciones de margen y padding (margen interior) con respecto a cada bloque de entrada o post.
Las opciones “fuera de la entrada” se corresponden con un margin o margen exterior y las opciones de “Dentro de la entrada” con las opciones de padding o margen interior.
QUIERO ASTRA PRO
Soy Blogger y formador profesional. Me gustaría que este blog te sirviera para conocer más de cerca el mundo del diseño web y de WordPress. Mi proyecto online es una plataforma de formación online tipo membership site, denominada cursotiendaonline.com donde podrás acceder a todos los cursos por solo 10 €/mes