Author : Jhon
Publicado : 12 diciembre, 2019
Cuando queremos un menú dinámico en wordpress es muy fácil de conseguir, cuando me refiero a menú dinámico quiero decir un menú en el cual vaya navegando y me resalte o me indique de alguna manera en que parte del menú estoy navegando, como bien sabemos una pagina puede estar constituida por muchas otras subpaginas, así que el hacer el menú dinámico es una buena opción para que los usuarios que naveguen por nuestra web sepan siempre donde están.
Como dije antes es muy fácil y wordpress nos da las herramientas, una de ellas es la clase :
.current_page_item
Esta clase aparece en el elemento del menú que coincide con la pagina en la que estamos navegando actualmente, veamos esta imagen:
como podemos ver en esta imagen de esta pagina web, estamos en la pagina de reservas y se resalta en el menú el ítem de menú reservas que es el que le corresponde.
Así en nuestro css pondremos :
.menu-principal ul li.current_page_item a{
border-bottom: 2px solid #666666;
}
Con este código se visualizara una barra de color gris justo debajo de cada ítem del menú.
Ahora yendo mas allá si tenemos un CPT Custom Post Type como hacemos para que nuestros post personalizados indiquen la pagina en la que estamos, para ello wordpress genera una clase CSS en el body de todos los post personalizados de nuestro de nuestro CPT.
Por ejemplo si mi cpt se llama themes se generara la clase :
.single-themes
Ahora el segundo paso es ir a apariencia->Menús, aquí deberemos agregar una clase a nuestra pagina donde visualizaremos los CPT, como ejemplo pondré la clase :
.menu-item-temas
Ahora el código seria este :
.single-themes .menu-principal .menu-item-temas a{
border-bottom: 2px solid #666666;
}
Deja una respuesta