• xiabolai

    (@xiabolai)


    Hi,

    I have a question about highlighting the current parent menu item in a dropdown menu. I’m using wordpress as a CMS.

    The menu section in question is like this:

    Top level menu item:

    Work

    Dropdown submenu categories:

    Interactive
    Microsite
    Email
    Print
    Collateral
    Direct Mail
    Outdoor
    Broadcast

    I have it now that when a user clicks on, let’s say, ‘Print’, ‘Print’ stays highlighted…BUT I want both ‘Print’ AND ‘Work’ to stay highlighted. I simply cannot figure out how to get the top level menu item ‘Work’ to stay highlighted too.

    Also, if the user clicks on a post within a submenu category like ‘Print’ for example, I’d like for ‘Print’ and ‘Work’ to stay highlighted.

    So basically, whenever a user is anywhere within the ‘Work’ section, on a subcategory or a post within a subcategoy, I’d like ‘Work’ to stay highlighted.

    Here’s the navigation code from header.php:

    <!-- Navigation -->
        <ul class="sf-menu">
        <li<?php
                    if (is_home())
                    {
                    echo " id=\"current\"";
                    }?>>
                    <a href="<?php bloginfo('url') ?>">Home</a>
    </li>
    
          <li>
              <a>Work</a>
                     <ul>
                         <?php wp_list_categories("exclude=$blog_ID&title_li="); ?>
        		</ul>
             </li> 
    
        <!--  <?php wp_list_categories("include=$blog_ID&title_li="); ?> -->
    
    <li<?php
                    if (is_page('About'))
                    {
                    echo " id=\"current\"";
                    }?>>
                    <a href="<?php bloginfo('url') ?>/about">About</a>
            </li>
    
    <li<?php
                    if (is_page('Contact'))
                    {
                    echo " id=\"current\"";
                    }?>>
                    <a href="<?php bloginfo('url') ?>/contact">Contact</a>
            </li>
        	</li>
        </ul>
    
    </div>

    Here’s the css:

    /* Navigation Highlights */
    
    .sf-menu li.current-cat a, li.current_page_item a {font-weight:bold;color:#e2007d;}
    
    #current a {font-weight:bold;color:#e2007d;}
    .sf-menu a:hover{color:#e2007d;}
    .sf-menu li.current-cat a{font-weight:bold;color:#e2007d;}
    .sf-menu li.current-cat a:hover{font-weight:bold;color:#e2007d;

    I figured out how to get other pages to stay highlighted, but I just can’t solve the riddle of how to get ‘Work’ to stay highlighted when on a submenu item.

    Here’s a link to the site: https://newsite.blairshapiro.com

    Been racking my brain for days, any help would be GREATLY appreciate.

    Thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter xiabolai

    (@xiabolai)

    Anyone? I’m going crazy trying to figure this out.

    Have tried code solutions, css solutions, read every related post…just can’t do it…

    mattcrace

    (@burntpixel)

    I see you got this sorted. Could you share with me the secret, I am going crazy too! I’m on 3 hours sleep right now because of this.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘menu parent/subcategories question…have tried EVERYTHING’ is closed to new replies.