WordPress challenge: getting class current_page_item to work when home page is not blog
December 5, 2007 – 10:30 am | by Miriam SchwabSorry for the confusing title, but there is an issue that we face over and over when using WordPress as a CMS, and have not been able to solve. When we are using WordPress as a CMS, our Blog page doesn’t pick up the current_page_item class and therefore its link on the nav bar isn’t highlighted like the other pages are. How can we get it to change?
I know that the above might not make sense, so here is a detailed description of the problem:
If you use WordPress as a CMS, you generally create the Pages you want to appear on your nav bar under Write > Write Page. One of those Pages is the Home page, for example, and you create another Page for your blog posts called Blog. Then, you go to Options > Reading, and select one of those pages for your front page from the drop-down list, in this case you would select the Home page, and another page for your blog posts, in this case the Blog page.
You create a style in your style sheet called current_page_item which causes the current page that the viewer is on to appear differently in the nav bar or list of pages. For example, you want the background color of that page on the nav bar to change from green to purple.
Now, here’s where the problem lies: all pages on the nav bar change from green to purple when the user is on that page…except the Blog page! For some reason, that Blog page does not pick up the current_page_item class.
So my question is: does anyone know of a solution to this problem?
Thanks!
15 Responses to “WordPress challenge: getting class current_page_item to work when home page is not blog”
By Nathan Rice on Dec 5, 2007 | Reply
I literally just had this problem yesterday, doing a custom theme for a client. Here’s what I did…
First of all, exclude both the “home” page, and the “blog” page from your list pages call.
Then add these two list items before the list pages call.
<li class=”<?php if ( is_page(’61′) ) { echo “current_page_item”; } ?>”><a href=”<?php echo get_settings(’home’); ?>”>Home</a></li>
<li class=”archives <?php if ( is_home() ) { echo “current_page_item”; } ?>”><a href=”<?php echo get_settings(’home’); ?>/archives/”>Blog Archives</a></li>
There’s absolutely nothing dynamic about it, but it works. WP really needs to work on this, if you asked me.
Nathan
By Ryan on Dec 5, 2007 | Reply
I never noticed this feature of WordPress before. Seems like a useful addition, albeit annoying that isn’t including categories into it.
There are two solutions I can think of for this (I haven’t tested either).
One way is to include your blog into a static page, that way the blog will behave just like a regular static page. This can be done by editing page.php and adding a loop whenever you are on the static page labelled ‘blog’.
Or you could manually add an ‘if’ statement between the section to add ‘current_page_item’ when you are on the blog page.
I have to go to work now, but I can post back with some code later tonight if you’d like.
By Ryan on Dec 6, 2007 | Reply
This is harder than it looked at first site. I cant’ find a conditional tag to target the blog posts page.
By Ryan on Dec 6, 2007 | Reply
Here you go … http://ryanhellyer.net/test/wordpress1/blog/
There has to be a better way to do this though. My method is quite crude and I’m 100% certain there has to be a better way to do it, I just can’t figure out what that may be. Quite infuriating!
By Ryan on Dec 6, 2007 | Reply
Problem fixed. I found the following link via a Google search … http://wordpress.org/support/topic/107583#post-596789
So the blog ‘page’ is actually the ‘home’ page, so you can use ‘is_home’ to target that page directly. I figured the new static page would be targeted with ‘is_home’, but apparently not!
By Ryan on Dec 6, 2007 | Reply
Looks like Nathan beat me to it (his post didn’t show up till after mine).
But Nathan, why do you have the ‘home’ button removed from the list_pages call? I found the home page worked fine on it’s own. The problem was with the posts page, not the ‘home’ page.
By Nathan Rice on Dec 6, 2007 | Reply
Ryan,
It does work, but the reason I hard coded it is because I like the home link to be the first in the list, and otherwise it can be hard to get it in the correct order.
Nathan
By Miriam on Dec 6, 2007 | Reply
Hi Ryan and Nathan - thanks for your input. I personally haven’t had a chance yet to try out your solutions, but my employee did with no luck. She ended up hacking wp-includes/classes.php on around line 512 as follows:
if ( $page->ID == $current_page )
to:
if ($page->ID == $current_page || ($current_page == 0 && $page->ID == get_settings(’page_for_posts’)))
It works, but it’s not great to have to change core files because it can be overwritten during an upgrade.
WordPress really should fix this problem, since they already offer the current_page_item class, so it might as well work properly and apply to all pages! It’s so frustrating.
By Darren Hoyt on Dec 7, 2007 | Reply
I use a similar-but-different method from Nathan’s. First, I make sure to put a conditional on the body of the page:
<body<?php if ( is_home() ) { ?> id="home"<?php } ?>>
Then I add this to the HTML:
<ul id="nav">
<li><a href="<?php echo get_option(’home’); ?>/" class="on">Home</a></li>
<?php wp_list_pages(’title_li=’); ?>
</ul>
And I make sure there’s a CSS rule to highlight the ‘Home’ button when you’re on that page:
#home .on {
background:#000;
}
By Thomas on Jan 10, 2008 | Reply
I fixed the problem by developing a plugin. You have to replace wp_list_pages by my own function and then you can sort the menu as you like. Have a look:
http://thomas.lippert.it/v4/wordpress-plugins/current-page-bugfix/
By Miriam Schwab on Jan 10, 2008 | Reply
Thomas - that’s a great plugin! I hope to test it out soon. Your other plugin "Logged-in Only" looks interesting too. I used Google Translate to figure out what it’s about, but not with much luck. Can you write an English summary of both these plugins and I’ll post about them here on WordPressGarage?
By Thomas on Jan 10, 2008 | Reply
The second plugin (Logged-in-only) is a bit bugy at the moment (v0.7) so i don’t want to make big publicity for it.
The plugin Current-Page Bugfix get it’s englisch summary yet. You can promote this one.
Thank you.
By Jamie on Jan 31, 2008 | Reply
This is one of the reasons I did not use the supploed function wp_list_categories.
as it did not highlight the current page.
My plugin however does Drop Down Menu WordPress plugin
It auto highlights the current page you are on.
You can arrange the pages and in the navigation menu anyway you want, and have a link to your blog/homepage as well.
By Miriam Schwab on Jan 31, 2008 | Reply
Jamie - looks great. I hope to try it out and see how it works.