Wordpress Themes - WP Forum at BFA
Click Here To DONATE! Support the theme development, get more attention and additional benefits based on your donation level. Your forum name will be highlighted.

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

Highlight active category / page item in menus


Build custom WP THEMES, without
coding.
Click here for THEMEFRAME

From the author of Atahualpa, the #1 most
downloaded (700,000+) theme @ wordpress.org
  #26  
Old Apr 20, 2009, 10:20 PM
Flynn's Avatar
Flynn
 
3,761 posts · Oct 2008
Munich, Germany
Please post or PM me your URL
  #27  
Old Apr 21, 2009, 08:39 PM
ScottKarlins's Avatar
ScottKarlins
 
16 posts · Apr 2009
Atlanta, GA
Flynn,

Got it all working. After reviewing your solutions for Tigger, and learning what each line was actually doing!, I got it all set:

/* DEFAULT */
div.flexipages_widget ul li.current_page_item a:link,
div.flexipages_widget ul li.current_page_item a:visited {
background: #ffffff !important;
border-left: solid 7px #cccccc !important;
color: #666666 !important;
}
/* For HOVER */
div.flexipages_widget ul li.current_page_item a:active,
div.flexipages_widget ul li.current_page_item a:hover {
background: #ffffff !important;
border-left: solid 7px #000000 !important;
color: #000000 !important;
}
/* For CURRENT */
div.flexipages_widget ul li.current_page_item a:link,
div.flexipages_widget ul li.current_page_item a:visited,
div.flexipages_widget ul li.current_page_item a:active,
div.flexipages_widget ul li.current_page_item a:hover {
background: #ffffff !important;
border-left: solid 7px #000000 !important;
color: #000000 !important;
}
/* Reset children of CURRENT */
div.flexipages_widget ul li.current_page_item ul li a:link,
div.flexipages_widget ul li.current_page_item ul li a:visited {
background: #ffffff !important;
border-left: solid 7px #cccccc !important;
color: #666666 !important;
}
div.flexipages_widget ul li.current_page_item ul li a:active,
div.flexipages_widget ul li.current_page_item ul li a:hover {
background: #ffffff !important;
border-left: solid 7px #000000 !important;
color: #000000 !important;
}


Sorry for all the posts!

Thank you,
Scott K.
  #28  
Old Jul 22, 2009, 01:35 AM
msc3
 
7 posts · Jul 2009
Flynn,

I'm also using the Flexipages plugin. I got it so that the active page is highlighted on the side navigation, which only contains secondary pages. but I want my primary page to show as active as well, so that the user knows which section they are in. Currently, I only have two primary pages that have sub pages, but I can't figure out how to make their respective primary page links, which are displayed across the top, appear as active when the user is on one the sub pages. Any suggestions?

Best,
Michael
  #29  
Old Jul 22, 2009, 07:43 PM
Flynn's Avatar
Flynn
 
3,761 posts · Oct 2008
Munich, Germany
Look into the source code (or use Firebug) to see what the parent of the currently active page got as additional CSS class, should be "current_page_parent". Then add that class to the CURRENT section of the code

/* For CURRENT */
div.flexipages_widget ul li.current_page_item a:link,
div.flexipages_widget ul li.current_page_item a:visited,
div.flexipages_widget ul li.current_page_item a:active,
div.flexipages_widget ul li.current_page_item a:hover,
div.flexipages_widget ul li.current_page_parent a:link,
div.flexipages_widget ul li.current_page_parent a:visited,
div.flexipages_widget ul li.current_page_parent a:active,
div.flexipages_widget ul li.current_page_parent a:hover
{
...


If there are several levels, all ancestors of the currently active page should get
current_page_ancestor, add that like current_page_parent to highlight all ancestors of the current page
  #30  
Old Jul 22, 2009, 11:04 PM
msc3
 
7 posts · Jul 2009
[Solved] That worked! I used firebug to determine the class of the primary navigation links, it now it works exactly the way I would expect. Thanks! Money is in your account.
  #31  
Old Mar 17, 2010, 01:43 AM
Mikii
 
16 posts · Jul 2009
Quote:
Originally Posted by msc3
[Solved] That worked! I used firebug to determine the class of the primary navigation links, it now it works exactly the way I would expect. Thanks! Money is in your account.
msc3, could you post your final code? I could use it.

Thanks!

Michele
  #32  
Old Apr 30, 2012, 06:08 PM
heimir
 
10 posts · Jan 2009
This is working well for me:

/* DEFAULT */
div.flexipages_widget ul li.current_page_item a:link,
div.flexipages_widget ul li.current_page_item a:visited {
background: #ffffff !important;
border-left: solid 7px #cccccc !important;
color: #666666 !important;
}
/* For HOVER */
div.flexipages_widget ul li.current_page_item a:active,
div.flexipages_widget ul li.current_page_item a:hover {
background: #ffffff !important;
border-left: solid 0px #000000 !important;
color: #000000 !important;
}
/* For CURRENT */
div.flexipages_widget ul li.current_page_item a:link,
div.flexipages_widget ul li.current_page_item a:visited,
div.flexipages_widget ul li.current_page_item a:active,
div.flexipages_widget ul li.current_page_item a:hover {
background: #ffffff !important;
border-left: solid 0px #ffffff !important;
color: #DF5408 !important;
font-weight:bold;
}

/* Reset children of CURRENT */
div.flexipages_widget ul li.current_page_item ul li a:link,
div.flexipages_widget ul li.current_page_item ul li a:visited {
background: #ffffff !important;

color: #254125 !important;
font-weight:normal;
}

Last edited by heimir; Apr 30, 2012 at 06:13 PM.

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Both Blog page and Static Front page highlight when Blog page selected lomaprietapottery Page & Category Menu Bars 20 Jul 13, 2012 04:58 PM
[SOLVED] Page Menu Sub Menus of Equal Width Craig Mattice Page & Category Menu Bars 4 Jun 17, 2009 03:46 AM
Customizing category menu bar with different images for every item GeoParadise Page & Category Menu Bars 5 Apr 17, 2009 05:50 PM
Dropdown menus displace the page. zoefriedlander Page & Category Menu Bars 3 Apr 15, 2009 11:41 PM
Page Menu Bar: Last Item on the Right-Hand Margin? PittFunck Page & Category Menu Bars 5 Mar 9, 2009 08:26 AM


All times are GMT -6. The time now is 10:16 AM.


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