Sin duda, la plantilla Astra Pro, es una de las mejores plantillas WordPress del mercado actual. Vamos a ver las opciones que incluye la plantilla Astra Pro para la personalización de la cabecera principal del header.
Astra pro dispone de un header dividido en 3 áreas diferentes. El área central, que es la barra principal o cabera principal, es donde se sitúa el logo y el menú principal de WordPress. La plantilla Astra dispone también de un área superior a esa cabecera principal (sobre la cabecera) y otro área inferior (bajo la cabecera).
DISFRUTA DE TODOS MIS CURSOS PREMIUM POR SOLO 10€/MES
ÍNDICE PERSONALIZAR HEADER ASTRA PRO
- ➡️1.- Localización de las opciones de personalización de la cabecera principal de Astra
- ➡️2.- Estructura de la cabecera principal de Astra Pro
- ➡️3.- Opciones cabecera principal móviles de la plantilla Astra.
- ➡️4.- Opciones de color y espaciado del header principal o cabecera principal de Astra.
- ➡️5.- Áreas o zonas de menú de la plantilla Astra Pro
➡️1.- Localización de las opciones de personalización de la cabecera principal de Astra
Para acceder a las opciones de personalización de la cabecera principal de la plantilla Astra Pro debes ir al panel de administración de WordPress e ir a: “Apariencia > Personalizar > Cabecera > Cabecera principal”
➡️2.- Estructura de la cabecera principal de Astra Pro
✔️Diseño: la plantilla Astra pro permite 3 diseños diferentes para la cabecera principal.
- i.- Diseño 1 cabecera Astra: con logo a la izquierda y menú principal a la derecha. Esta es la opción más habitual en diseño web.
- ii.- Diseño 2 cabecera Astra: con logo arriba y menú principal abajo, ambos centrados. Este diseño se suele utilizar cuando tenemos tantos ítems de menú que nos obliga a disponer de toda la anchura del header disponible.
- iii.- Diseño 3 cabecera Astra: con logo a la derecha y menú principal a la izquierda.
✔️Anchura: en este apartado, la plantilla Astra nos da dos opciones
- i.- Ancho del contenido: en este caso, los elementos que conforman la cabecera principal (logo + menú) tienen como ancho máximo el ancho del contenedor interior (que es el contenedor que incluye en su interior el bloque principal de contenido y el sidebar o barra lateral)
- ii.- Ancho completo: si elegimos esta opción, los elementos que conforman la cabecera principal con Astra, tendrían anchura completa. Es decir, no tendrían una limitación en anchura como sucedía en el apartado anterior.
✔️Borde inferior cabecera principal: la plantilla Astra nos permite personalizar un borde situado en la parte inferior de la cabecera principal.
- i.- Tamaño de borde inferior: aquí estableceremos el grosor del borde en px. Si queremos que no se muestre ningún borde, podremos 0
- ii.- Color de borde inferior: en este selector seleccionaremos el color que queremos que tenga el borde.
Aquí tienes también un descuento del 10% en la contratación de la plantilla Astra.
QUIERO ASTRA PRO
➡️3.- Opciones cabecera principal móviles de la plantilla Astra.
En este apartado, la plantilla Astra dispone de una opción de diseño de cabecera principal específica para dispositivos móviles.
Para ver esta opción debes poner la previsualización de la pantalla en tipo móvil. Tienes 3 iconos en la parte inferior de la barra lateral izquierda de opciones. Cada icono representa un tipo de visualización. En este caso, debes hacer clic en el icono en forma de dispositivo móvil.
Ahora, en el apartado: “CABECERA PARA MÓVILES” verás que tenemos dos opciones:
- Opción 1: en este caso, el logo se sitúa a la izquierda y el icono tipo hamburguesa se coloca a la derecha.
- Opción 2: con esta opción, el logo se sitúa en la parte superior de la cabecera móvil y el icono se sitúa por debajo. Ambos centrados.
➡️4.- Opciones de color y espaciado del header principal o cabecera principal de Astra.
En la parte inferior de la barra latera de opciones de Astra de la cabecera principal, tienes dos apartados: “COLOR” y “ESPACIADO”
✔️En el apartado “COLOR” podrás personalizar:
- a.- Color de fondo: desde aquí podrás establecer un color de fondo para la cabecera principal. Fíjate que tienes un icono en forma de “móvil”. Lo que significa, que podrás personalizar el color de fondo de manera independiente en PC, Tablet y móvil.
- b.- Imagen de fondo: aunque no es nada habitual, también tienes la opción de poner una imagen de fondo en vez de un color de fondo. En este caso, fíjate que tienes un enlace con el texto: “Más ajustes”. Desde este apartado podrás personalizar la forma y posición en que se visualizará la imagen.
✔️En el apartado “ESPACIADO:
Podrás establecer un padding o margen interior de la cabecera principal. Podremos aumentar ese padding de manera independiente en cada lateral y en cada tipo de dispositivo.
Aquí tienes también un descuento del 10% en la contratación de la plantilla Astra.
QUIERO ASTRA PRO
Vamos a ver también las zonas o áreas de menú de que dispone la plantilla Astra. Estas zonas serán en las cuales podrás insertar o añadir un menú con WordPress.
Para realizar esta asignación deber ir a: “Apariencia > menús”.
En el apartado “Ajustes del menú” verás que la plantilla Astra dispone de 4 áreas de menú:
- i.- Menú primario: si asignamos un menú de wordpress a esta zona el menú se mostrará en la cabecera principal.
- ii.- Menú del pie de página: si asignamos un menú de wordpress a esta área, el menú se mostrará en el footer de la web.
- iii.- Menú de sección sobre la cabecera: si asignamos un menú de wordpress a esta zona, el menú se mostrará en la barra superior del header. Barra situada sobre la cabecera principal.
- iv.- Menú de sección bajo la cabecera: si asignamos un menú de wordpress a esta zona, el menú se mostrará en la barra situada en el header, bajo la cabecera principal.
Áreas de menú de la plantilla 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
