I have added hover and active effects to the items on the main menu. I would like them to also show active while on their subpages. I have created the pages to be children and grandchildren of the menu items. Would you mind helping me with the CSS to assign this?
Thanks in advance.
Main menu items active while on child and grandchild pages
8 posts from 4 voices-
Posted 1 year ago #
-
Hey,
use following css code (in css/custom.css) and adjust the color values:
.current-menu-item a { color: #444444; } .main_menu li.current-menu-parent a, .main_menu li.current-menu-ancestor a{ color: #777777 !important; /* highlight color */ } .main_menu li.current-menu-parent ul li.current-menu-item a, .main_menu li.current-menu-ancestor ul li.current-menu-item a { color: #777777 !important; /* highlight color */ } .main_menu li.current-menu-parent ul li a, .main_menu li.current-menu-ancestor ul li a { color: #444444 !important; /* default nav link color */ }Posted 1 year ago # -
Hi,
this code works fine. But I need this for the submenu, too.
Screenshot of my site:
http://i41.tinypic.com/dmp9gp.jpgI have tried this CSS without success:
#header .submenu a:active {
color:#d59cb4 !important;
text-decoration: underline;
}
and alternatively this
.submenu .menu li a:active {
color:#d59cb4 !important;
}
None of them is working. I would like to have an active link color, when I am at one of these subpages from this submenu.
Hovering is working with this:
#header .submenu a:hover{
color:#f2f6fa;
text-decoration: underline;
}
but I don't get it to work with the active link color.
Could someone help me please? Thanks a lot!
Posted 1 year ago # -
You can try:
.submenu .menu li.current_page_item a, .submenu .menu li.current_page_item a:hover{ color:#d59cb4 !important; text-decoration: underline; } .submenu .menu li a:hover{ color:#d59cb4 !important; text-decoration: underline; } .submenu .menu li.current-menu-parent a, .submenu .menu li.current-menu-parent a:hover{ color:#d59cb4 !important; text-decoration: underline; }however this solution requires a "custom menu" (you can build it with the menu manager - Appearance > Menus).
Posted 1 year ago # -
Thanks, but what do you mean with "custom menu"?
I already have two menu made with the menu manager:
http://i39.tinypic.com/2jb70ht.jpg
and this is the head of my site (still offline):
http://i42.tinypic.com/b7xglv.jpg
I've used your code above, but it doesn't work. Have I misunderstood something?
Posted 1 year ago # -
Ok, I got it ... I have just copy&paste your code and have not seen, that there is a "hover" in it; I changed it to "active" and then ... tatatataaaa ... it works like a charm!
Thanks, Dude!
Posted 1 year ago # -
Glad that it works now :)
Posted 1 year ago # -
Dude, I have added your initial CSS code to custom.css in order to change the active link color but it's not working for me. I tested in a different browser to be sure it's not a cache thing... but the active link is still showing as the secondary color.
Would you take a look to see what I might be missing?
The site is at: http://liga.ca/
Thanks!
HeatherPosted 1 year ago #
Reply
You must log in to post.














