Wordpress Themes - WP Forum at BFA
There will be no more development for Atahualpa (or any other theme), and no support. Also no new registrations. I turned off the donation system. I may turn the forum to read only if it gets abused for spam. Unfortunately I have no time for the forum or the themes. Thanks a lot to the people who helped in all these years, especially Larry and of course: Paul. Take care and stay healthy -- Flynn, Atahualpa developer, Sep 2021

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Page & Category Menu Bars »

[SOLVED] highlight current menu item w/out highlighting children if parent is selecte


  #1  
Old Sep 24, 2011, 12:05 PM
tnandrick
 
43 posts · Nov 2010
Hi JD --

I've looked over your thread w/the menu cheat sheet (Awesome!)

What I would like to do is have the current menu item selected. My current CSS inserts:

Code:
#menu2 ul.rMenu li a:link, 
#menu2 ul.rMenu li a:visited,  
#menu2 ul.rMenu li a:active, 
#menu2 ul.rMenu li {
	background: #d20909 !important;
	color: #000000 !important;
}

#menu2 ul.rMenu li a:hover,
#menu2 ul.rMenu li.current-menu-item a  {
	background: #aa0707 !important;
	color: #f0f000 !important;
}
Yes, I am using the WP menu system, a mixed bag of categories, pages, and posts within the menu. The current CSS works great for a subpage of a menu item. However, if you select the "top-level/parent" menu item, all subpages are also highlighted. Is there a way around this?

Site: http://bit.ly/oVCv9q
ATA 3.6.7
WP 3.2.1

Thanks in advance
  #2  
Old Sep 24, 2011, 12:24 PM
tnandrick
 
43 posts · Nov 2010
Whoot!

After looking over some other posts (sometimes relevant info is hard to find until you post your own threads and the forum suggests other topics) here is the current CSS inserts that do what I wanted:

Code:
#menu2 ul.rMenu li a:link, 
#menu2 ul.rMenu li a:visited,  
#menu2 ul.rMenu li a:active, 
#menu2 ul.rMenu li {
	background: #d20909 !important;
	color: #000000 !important;
}

#menu2 ul.rMenu li a:hover,
#menu2 ul.rMenu li.current-menu-item a  {
	background: #aa0707 !important;
	color: #f0f000 !important;
}

#menu2 ul.rMenu li.current-menu-item ul li a {
	background: #d20909 !important;
	color: #000000 !important;
}

#menu2 ul.rMenu li.current-menu-item ul li a:hover {
	background: #aa0707 !important;
	color: #f0f000 !important;
}
Tim
  #3  
Old Sep 24, 2011, 12:52 PM
tnandrick
 
43 posts · Nov 2010
And FTW... (or "charge it to the game" for you Jay Mohr fans)

Code:
#menu2 ul.rMenu li a:link, 
#menu2 ul.rMenu li a:visited,  
#menu2 ul.rMenu li a:active, 
#menu2 ul.rMenu li {
	background: #d20909 !important;
	color: #000000 !important;
} /* base bg's and colors for everything except hover rules */

#menu2 ul.rMenu li a:hover {
	background: #aa0707 !important;
	color: #f0f000 !important;
} /* hover rules */

#menu2 ul.rMenu li.current-menu-item a  {
	background: #aa0707 !important;
	color: #eeeeee !important;
} /* special rule for the currently selected items */

#menu2 ul.rMenu li.current-menu-item ul li a {
	background: #d20909 !important;
	color: #000000 !important;
} /* special rule for children in case parent element is selected */

#menu2 ul.rMenu li.current-menu-item ul li a:hover {
	background: #aa0707 !important;
	color: #f0f000 !important;
} /* redo so that hover rules "stick" */
Tim

Last edited by tnandrick; Sep 24, 2011 at 01:05 PM. Reason: clean up the commenting so it's clean in "inserts"
  #4  
Old Sep 24, 2011, 01:41 PM
tnandrick
 
43 posts · Nov 2010
Last post about this, I swear...

Using the above code WILL make your little dropdown arrows disappear for the menus. If you would like to preserve these arrows, simply change "background" statements to "background-color", and all is well.

I know, should have tested before I posted everything and got so excited...
  #5  
Old Nov 8, 2013, 03:11 PM
dabeed
 
30 posts · Nov 2012
tnandrick, thank you, this is AWESOME. This was exactly what I was looking for, and didn't find, and then found by accident, while researching something else.

There's ONE tiny thing: I like to have the currently selected menu item be given the hover treatment, even when the user is not hovering, so it clearly shows the user which choice is "current." And I'm very new to CSS.

Would you know the line(s) that would do that?
  #6  
Old Nov 8, 2013, 11:24 PM
dabeed
 
30 posts · Nov 2012
Actually, re: my last comment, I see that that's what you were addressing with this part here:

Code:
#menu2 ul.rMenu li.current-menu-item a  {
	background: #aa0707 !important;
	color: #eeeeee !important;
} /* special rule for the currently selected items */
But for some reason it doesn't work for me. I'll keep experimenting!
WP 3.7.1
ATA 3.7.12
  #7  
Old Nov 9, 2013, 08:24 AM
dabeed
 
30 posts · Nov 2012
Ok I fixed this on my end by repeating the appropriate snippet from css.php, swapping out the php for the actual colors, and adding !important:

Code:
/* "current" page and hover, first part old version */
div#menu1 ul.rMenu li.current-menu-item > a:link,
div#menu1 ul.rMenu li.current-menu-item > a:active,
div#menu1 ul.rMenu li.current-menu-item > a:hover,
div#menu1 ul.rMenu li.current-menu-item > a:visited,
div#menu1 ul.rMenu li.current_page_item > a:link,
div#menu1 ul.rMenu li.current_page_item > a:active,
div#menu1 ul.rMenu li.current_page_item > a:hover,
div#menu1 ul.rMenu li.current_page_item > a:visited {
    background-color: #04644B !important;
    color: #FFFFFF !important;
    }
Thanks again!

Bookmarks

Tags
css inserts, menu 2, selected links

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Lower case children and Bold current item deuxetoiles Sidebars & Widgets 10 Jun 13, 2011 11:30 AM
[SOLVED] Getting children to stay as children when parent is hidden SkeanDhude Page & Category Menu Bars 6 Jan 31, 2011 04:58 AM
Page menu: highlight a parent as current, even when on a subpage andd Page & Category Menu Bars 0 May 16, 2010 05:52 AM
category menu lists everything when item is selected. ramapoughnative Page & Category Menu Bars 3 Jul 21, 2009 03:44 AM
Color of children of current page in menu BradBrown Page & Category Menu Bars 0 Mar 22, 2009 02:38 PM


All times are GMT -6. The time now is 09:27 PM.


Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.