WordPress.org

Ready to get started?Download WordPress

Forums

Highlight parent page in nav when on child page (5 posts)

  1. mousetracks
    Member
    Posted 6 years ago #

    I'm building my site with pages, not worried about posts here.

    If I structure my pages as follows:
    -About Us
    --History
    --Contact

    When I'm on the About Us page the page name in the navigation is highlighted. But when I go to History or Contact the parent page name in the nav is no longer highlighted. How do I change this? I'm new to coding, basically teaching myself as I go.

    Here's a snippet of my current nav code in my header.php file:

    <ul id="nav">

  2. href="<?php bloginfo('url'); ?>">home
  3. href="<?php bloginfo('url'); ?>/archives/">archives
  4. href="<?php bloginfo('url'); ?>/about-us/">about us
  • mousetracks
    Member
    Posted 6 years ago #

    Ignore the code snippet, it converted to html. Let me try this:

    <ul id="nav">
    		<li><a <?php if (is_home()) echo('class="current" '); ?>href="<?php bloginfo('url'); ?>">home</a></li>
    		<li><a <?php if (is_archive() || is_page('archives')) echo('class="current" '); ?>href="<?php bloginfo('url'); ?>/archives/">archives</a></li>
    		<li><a <?php if (is_page('about-us')) echo('class="current" '); ?>href="<?php bloginfo('url'); ?>/about-us/">about us</a></li>
  • volfro
    Member
    Posted 6 years ago #

    Is there a reason you're manually listing the top-level pages?

    Take a look at the Codex entry for wp_list_pages. It explains the use of that template tag in pretty good detail; wp_list_pages gives active pages a class of current_page_item, and active pages' parents a class of current_page_parent. Styling is just a matter of changing "current" in your stylesheet to "current_page_item" or "current_page_parent", if you let WP do the dirty work.

  • mousetracks
    Member
    Posted 6 years ago #

    I'm manually listing them so I can control the order in which they appear.

  • creativeworldstudio
    Member
    Posted 6 years ago #

    I had the same issue (now fixed) - try this: http://www.umaitech.com/cms/?p=27#comment-5489

  • Topic Closed

    This topic has been closed to new replies.

    About this Topic

    Tags