Results 1 to 5 of 5

Thread: php and class="active" for menu

  1. #1

    Cool php and class="active" for menu

    Hi all-

    So I have been dipping into some php and taken the tutorials at http://www.w3schools.com/ which have been helpful. I need some help with coding a php statement. I already searched on the forums so if I missed a similar post please send the link.

    What I am looking to do is use php code ( I'm assuming some sort of if statement) to activate the ' class="active" ' on the page it is on. So for an example, I have a menu with the following pages:

    Home | Basketball | Baseball | About Us

    If someone clicks on the basketball link, I would like the page to load with the same menu (which I've accomplished using php) but with ' class="active" ' engaged (the next thing I am trying to accomplish). What's the easiest way to do this?

    I have found this link: http://textpattern.org/tutorials/899...h-active-class but it requires you to add and install a plugin. I don't think this is the easiest way to do, but I could be wrong.

    Thanks for your help!

  2. #2

    Default

    I've fiddled with this in the past and I don't know if I found the correct solution or not, but here is what I do:

    1. I name each page (Home, Basketball, Baseball, About Us) to a page variable at the very top of each page:
    PHP Code:
    <?php
    $page 
    "home";
    ...
    ?>
    Then in the menu code, I use the php switch structure to check what value for $page has been set. This allows me to set the active class on the correct line:

    PHP Code:
    <ul div="mainNav">
    <?php
    switch ($page) {
        case (
    "home"):
    ?>
           <li class="active"><a href="index.php">Home</a></li>
           <li><a href="basketball.php">Basketball</a></li>
           ......
    <?php
           
    break;
        case (
    "basketball"):
    ?>
           <li><a href="index.php">Home</a></li>
           <li class="active"><a href="basketball.php">Basketball</a></li>
           ......
    <?php
           
    break;
        case (
    "baseball"):
    ?>
           <!--set the baseball link to active-->
    <?php
           
    break;
        
    // other cases go here for other menu items
        
    default:
        
    //probably the menu items with no active class at all ...
        
    break;
    }
    ?>
    </ul>
    Hope that makes sense. Basically what is going on is the code is looking at the $page variable and then using the case statements to render the correct html to the page. If no match is found, that's when the default comes. This is important in menus because if there is not a match, and no default statement, then you won't get a menu ... and you need a menu .... we all need menus!!

    ~regards
    He is no fool that gives what he cannot keep to gain what he cannot lose. - Jim Elliot
    4ChristMinistry.org - Web development tutorials and Community forum.
    Demos - Kicking the tires on some popular software.

  3. #3
    Join Date
    Feb 2009
    Location
    Massachusetts, USA
    Posts
    132

    Default

    websitebuilder101,
    I simply use is a php include on all my pages. The include is simply an HTML file with my menu and banner pre-coded. Using css, I accomplish what you seek to do quite easily. To see what I mean you can check my site: http://wkevin.com. I sent you a pm if you need help with this. I'll be out for the rest of the day though.

  4. #4

    Default

    Here is simple example:

    PHP Code:
    $pages["home"] = "home page";
    $pages["products"] = "our products";
    $pages["contact"] = "contact us";

    $active_page $_GET["page"];

    foreach(
    $pages as $page => $page_title)
    {
      
    $suffix = ($page == $active_page) ? "_active" "";
      
    $nav.= "<a href='?page=".$page."' class='navigation".$suffix."'>$page_title</a>";
    }

    print 
    $nav
    This code will print navigation as list of <a> tags. You can modify it to create table, list or whatever you need. Pages are added by modifying array at the top.

    In css file for this page, create two selectors: navigation and navigation_active and style how you like links and active links to look.

    This way you do not need to repeate navigation code on eache page.

    Hope this helps.
    Regards

  5. #5

    Default Thanks everyone . . .

    It looks like I got a lot of options going about accomplishing this. I will mess around with it this weekend (hopefully) and see which option works out the best.

    Thanks again for the help!

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
ankara escort show yeri malatya escort erotik film izle adana escort escort eskişehir didim escort escort bayan adult forum porno
rokettube