Navigation Question ( Tabbed Nav PHP + CSS )

Discussion in 'WordPress' started by JamesMichael Solutions, Aug 26, 2009.

  1. #1
    What I am looking for is a way to make a tab "active" in my navigation, depending on what page they are on within Word Press

    <li class="active"><a href=""><span>Home</span></a></li>
    <li><a href=""><span>Dr. Richard E. Klein</span></a></li>
    <li><a href=""><span>Articles</span></a></li>
    <li><a href=""><span>Testimonials</span></a></li>
    <li><a href=""><span>FAQ's</span></a></li>
    <li><a href=""><span>Contact</span></a></li>

    Here is an example ( home/tmj/sleepapnea = only pages in example )

    http://www.amsserv1.com/~mhnicom/test

    I am assuming there is some way to code this with PHP where the page name determines which list item has the "active" class.

    Any help would be greatly appreciated.

    Thanks,

    James M. Plouffe
     
    JamesMichael Solutions, Aug 26, 2009 IP
  2. hmansfield

    hmansfield Guest

    Messages:
    7,904
    Likes Received:
    298
    Best Answers:
    0
    Trophy Points:
    280
    #2
    I'm not sure what you are asking. If by active, you mean a live link...it's simply a matter of inputting the path, or URL of where you want it to go. If you mean the "hover effects" when you mouse over a tab or link. That is in the CSS file.
    If you mean text description of each link or tab, simply add title="what ever you want it to say" at the end of your URL, or image path before the ">"
     
    hmansfield, Aug 26, 2009 IP
  3. JamesMichael Solutions

    JamesMichael Solutions Peon

    Messages:
    52
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    How can I change the class of the list item, depending on what page I am at?

    I'm viewing the homepage, so the list item for the Home menu button is active.

    Say If I clicked on Articles, is there some sort of "if then" statement that could be used

    If your are viewing the articles page THEN that particular list item inherits the "active" class?


    <li class="active"><a href=""><span>Home</span></a></li>
    <li><a href=""><span>Dr. Richard E. Klein</span></a></li>
    <li><a href=""><span>Articles</span></a></li>
    <li><a href=""><span>Testimonials</span></a></li>
    <li><a href=""><span>FAQ's</span></a></li>
    <li><a href=""><span>Contact</span></a></li>
     
    JamesMichael Solutions, Aug 26, 2009 IP
  4. hmansfield

    hmansfield Guest

    Messages:
    7,904
    Likes Received:
    298
    Best Answers:
    0
    Trophy Points:
    280
    #4
    Still confused.
    So you want to add a different function to the menu buttons ?
    I need you to simply this.

    You click a menu button and it goes to that page..what else do you want to happen ?
     
    hmansfield, Aug 26, 2009 IP
  5. JamesMichael Solutions

    JamesMichael Solutions Peon

    Messages:
    52
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    I wanted the page to determine the class of the corresponding list item ( or navigation item )

    <li class="THE PAGE I AM AT"><a href="">home</a> </li>



    then say if I clicked on about, the class of the list item containing <a href="">about</a> would change to class="THE PAGE I AM AT"







    <?php
    $menu = <<<MENU
    <ul id="nav">
    <li><a href="/" title="Where the heart is">Home</a></li>
    <li><a href="/archives/" title="Things that have passed.">Archives</a></li>
    <li><a href="/about/" title="All about Matt">About</a></li>
    <li><a href="/photos/" title="It's the 'photo' in Matt">Photos</a></li>
    <li><a href="/music/" title="The food of love">Music</a></li>
    <li><a href="/scripts/" title="Free (as in beer and speech) code">Scripts</a></li>
    <li><a href="/jazzquotes/" title="Great quotes from amazing musicians. More in the future.">Jazz Quotes</a></li>
    <li><a href="/toys/" title="Make me tick: Reviews of various electronics I own or have come into contact with.">Toys</a></li>
    <li><a href="/xml/" title="Syndicate the content here. Get Matt to-go.">Syndicate</a></li>
    <li><a href="/portal/" title="My personal start page, has my blogroll and links to interesting sites">Portal</a></li>
    <li><a href="/zeitgeist/" title="A google of random stats about the website">Zeitgeist</a></li>
    <li><a href="/contact/" title="Reach out and touch somebody. How to get in contact with me, also has GPG key and geek code.">Contact</a></li>
    </ul>
    MENU;

    $lines = split("\n", $menu);
    foreach ($lines as $line) {
    $current = false;
    preg_match('/href="([^"]+)"/', $line, $url);
    if (substr($_SERVER["REQUEST_URI"], 0, 5) == substr($url[1], 0, 5)) {
    $line = str_replace('<a h', '<a id="current" h', $line);
    }
    echo $line."\n";
    }
    ?>


    http://ma.tt/scripts/intellimenu/
     
    JamesMichael Solutions, Aug 27, 2009 IP