WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I have two links: Products and News.

When i click on Products or News, it returns me an archive page that contains some posts, when i click on a post it returns me a single page of this post.

In the menu I use this code on <li> to add a class called active if the page is home:

<li<?php if(is_home()) {?> class="active"<?php } ?>>

But i dont know how to do it when I have two archive pages and two singles pages.

If i use if( is_archive() || is_single() ) it'll add class on both menu itens.

Some help would be appreciated.

share|improve this question
How is your menu created? – s_ha_dum Feb 6 '14 at 14:40
@s_ha_dum I didnt use wp_nav_menu, i created it myself on code – user47239 Feb 6 '14 at 14:59
is_archive and is_single should be mutually exclusive. I'd suggest you post more code. Why are you not using wp_nav_menu? – s_ha_dum Feb 6 '14 at 15:01
@s_ha_dum I tried to use wp_nav_menu, it add class current but doesnt add this class on Products nor News. – user47239 Feb 6 '14 at 15:08
Use wp_nav_menu and see the answer by @BradDalton. – s_ha_dum Feb 6 '14 at 15:19
up vote 2 down vote accepted

You could add conditional classes for each in your child theme functions file:

Here's one example you can modify to suit your own needs.

add_filter('nav_menu_css_class' , 'wpsites_nav_class' , 10 , 2);

function wpsites_nav_class($classes, $item){

if( is_archive() && $item->title == "Products"){     

         $classes[] = "products-class";
 return $classes;

Source http://codex.wordpress.org/Function_Reference/wp_nav_menu#Adding_Conditional_Classes_to_Menu_Items

You can then style your nav menu using the new class in your child themes style.css file.

.products-class {

Your CSS declarations

This CSS code is conditional based on the PHP code above.

share|improve this answer
where i supposed to put this code? on function.php? and where this "products-class" will appear? – user47239 Feb 6 '14 at 14:58
Put the code at the end of your functions.php file. Use the class in your child themes style.css file. – Brad Dalton Feb 6 '14 at 14:59
I mean where this function add the class on code? on body? – user47239 Feb 6 '14 at 15:09
Adds it to the nav menu item you include in the PHP code. It conditionally adds it to the products menu item only when on an archive page. Simply change the conditional tags to suit your needs.codex.wordpress.org/Conditional_Tags – Brad Dalton Feb 6 '14 at 15:13
thanks dude! it worked! – user47239 Feb 6 '14 at 17:03

I suppose your Products and News posts are custom posts.
For both conditional tags, there is a $post_type-specific equivalent:

if (is_post_type_archive('products')) {
   // ...
} elseif (is_post_type_archive(array('news', 'something'))) {
   // ...
} elseif (is_singular('products')) {
   // ...
} elseif (is_singular(array('news', 'something'))) {
   // ...

So, for Products, it would be:

if (is_post_type_archive('products') || is_singular('products'))

News accordingly.


share|improve this answer
in fact it's what im looking for! thanks – user47239 Feb 6 '14 at 16:53

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.