• hi
    on a wordpress site i am currently making, i have a horizontal nav bar at the top. [see site here].

    Each link in the nav bar links to particular post categories.

    Does anyone know how i could go about making the currently selected category highlight in the nav bar? So you know which category you’re looking at currently?

    Hope this makes sense!
    Cheers
    Bilateral

Viewing 12 replies - 1 through 12 (of 12 total)
  • See if you can get some ideas from this Codex page:
    http://codex.wordpress.org/Dynamic_Menu_Highlighting

    Thread Starter bilateral

    (@bilateral)

    thanks BPartch, and moshu. From the looks of that codex page, the dynamic menu highlighting works only for static Pages. Is that right?
    However, what I was after was the idea that the nav bar would select a Category rather than a static Page…Is that possible?

    Since I don’t see that you’d add 10 more categories every day… I’d do it manually using the is_category(x) conditional.

    Thread Starter bilateral

    (@bilateral)

    thanks moshu!

    i think i get what you’re suggesting. instead of the

    is_page(‘Page One’)

    i might put, for instance,

    is_category(‘public art’)

    right?

    if i understand right, this should only work if each Post is filed under ONLY ONE category? Is that true?

    Hello

    Try this, no guarantees, as it is late and I am sleepy πŸ™‚

    This goes in the head section of header.php:

    <?php
    if ( is_home() ) { $current = 'home'; }
    elseif ( is_category('current-projects') ) { $current = 'projects'; }
    elseif ( is_category('archive') ) { $current = 'archive'; }
    elseif ( is_category('public-art') ) { $current = 'art'; }
    elseif ( is_category('writing') ) { $current = 'write'; }
    elseif ( is_category('cv') ) { $current = 'cv'; }
    elseif ( is_category('links') ) { $current = 'links'; }
    elseif ( is_category('contact') ) { $current = 'contact'; }
    ?>
    <style type="text/css">
    #navlist li.<?php echo $current; ?> {
    color: black;
    background-color: gray;
    text-decoration: none;
    }
    </style>

    This goes where you have the nav code in header.php

    <div id="navcontainer">
    <ul id="navlist">
    <li class="home"><a href="http://jennybrownjenny.com/wordpress">home</a>
    <li class="projects"><a href="http://www.jennybrownjenny.com/wordpress/category/current-projects/">current projects</a>
    <li class="archive"><a href="http://jennybrownjenny.com/wordpress/category/archive">project archive</a>
    <li class="art"><a href="http://jennybrownjenny.com/wordpress/category/public-art">public art</a>
    <li class="write"><a href="http://jennybrownjenny.com/wordpress/category/writing">writing</a>
    <li class="cv"><a href="http://jennybrownjenny.com/wordpress/category/cv">resume</a>
    <li class="links"><a href="http://jennybrownjenny.com/wordpress/category/links">links</a>
    <li class="contact"><a href="http://jennybrownjenny.com/wordpress/category/contact">contact</a>
    </div>

    Hope it helps πŸ™‚

    Basically, yes, that’s what I was thinking of. Though I’d use (ID#) – less chances to go wrong.

    And I don’t see how that relates to posts in one or more categories. When you display a category archive (as it happens when you click on a category name – it is about that category’s listing, not about individual posts.
    Read more: http://codex.wordpress.org/Conditional_Tags#A_Category_Page

    I also recommend using the categories ID# vs the name (as I did above).

    is_category('ID#')

    I just did that because I do not know what the ID#’s are, hope it works for you. πŸ™‚

    Moderator Samuel Wood (Otto)

    (@otto42)

    WordPress.org Admin

    I’d make it a bit more generic myself. On the home page, I’d highlight the home one, of course. On the category archives, I’d highlight the category. But I’d also want to highlight all the relevant categories on the single pages, handling multiple categories if needed. I’d also want the category list to be dynamic, because manually editing stuff is such a pain.

    So here’s my solution (untested, probably has a bug or two):

    function display_category_list ()
    {
    global $wpdb;
    $query = "SELECT cat_ID, cat_name
    FROM $wpdb->categories
    ORDER BY cat_name asc";
    $categories = $wpdb->get_results($query);
    if (is_category()) {
    ?>
    <style type="text/css">
    #navlist li#<?php echo 'cat_'.single_cat_title(); ?> {
    color: black;
    background-color: gray;
    text-decoration: none;
    }
    </style>
    <?php
    }
    if (is_home()) {
    ?>
    <style type="text/css">
    #navlist li#cat_home {
    color: black;
    background-color: gray;
    text-decoration: none;
    }
    </style>
    <?php
    }
    if (is_single()) {
    foreach($categories as $category) {
    if (in_category()) {
    ?>
    <style type="text/css">
    #navlist li#cat_<?php echo $category->cat_name; ?> {
    color: black;
    background-color: gray;
    text-decoration: none;
    }
    </style>
    <?php
    }
    }
    }
    ?>
    <div id="navcontainer">
    <ul id="navlist">
    <li id="cat_home">
    <a href="<?php echo get_settings('home'); ?>">
    Home
    </a>
    </li>
    <?php
    foreach ($categories as $category) {
    echo '<li id="cat_'.$category->cat_name.'">';
    echo '<a href="'.get_category_link($category->cat_ID).'">';
    echo $category->cat_name;
    echo '</a></li>';
    }
    ?>
    </ul>
    </div>
    <?php
    }
    ?>

    Then just call display_category_list() wherever you want to put the list at.

    Thread Starter bilateral

    (@bilateral)

    thanks all
    not being as savvy as you all in this stuff, it’ll take me a little while to try these solutions out. i’ll let you know how it goes!
    cheers

    Hi there,

    OK I don’t know what’s wrong with me but I did exactly what you guys said ad it did absolutely nothing. Nada. No difference. Nothing is highlighted when you’re one particular category page or another.

    Any suggestions?

    Alex

    Hahahahaha never mind!! Small typo.

    Thanks you guys are my heroes!

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘A nav bar which highlights current category?’ is closed to new replies.