SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Evangelist runeveryday's Avatar
    Join Date
    Jul 2009
    Posts
    437
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    How add active state to the navigation menu with php

    PHP Code:
    <div id="nav">
                <
    ul>
                    <
    li class="item"><a href="/">Home</a>/</li>
                    <
    li class="item"><a href="/two">Tab2</a></li>
                    <
    li class="item"><a href="/three">Tab3</a></li>
                     <
    li class="item"><a href="/four">Tab3</a></li>
               </
    ul>
    <
    div
    IF I want to add the class="active" to a label, like this
    Code:
     <li class="item"><a href="" class="active">Home</a>/</li>
    . how should i do?i got this, but it's too complicated. is there a simple way to get it ? thank you.


    PHP Code:
    <?php
    $current 
    = array("","two","three","four");
    ?>
    then 
    <li class="item"><a href="/$current[0]" class="<?php if($GET[$current[0]=="") echo "active"?>">Home</a>/</li>
     <li class="item"><a href="/$current[1]" class="<?php if($GET[$current[1]]=="two") echo "active"?>">Tab2</a></li>
         <li class="item"><a href="/$current[2]" class="<?php if($GET[$current[2]]=="three") echo "active"?>">Tab3</a></li>
          <li class="item"><a href="/$current[3]" class="<?php if($GET[$current[3]]=="four") echo "active"?>">Tab3</a></li>
    is the code that wrote by me right?

  2. #2
    SitePoint Addict D3V4's Avatar
    Join Date
    May 2010
    Posts
    370
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Why don't you add the class directly in the HTML? Depending on the page you are in, you can add the active class to the correct link and you wouldn't need to use any scripts.

    Edit: I've just realized that maybe you want to use GET requests, but it doesn't look like you are having any parameters in your URL.

    You code has some syntax errors, by the way:

    Code:
    $current = array(1 => '', 2 => 'two', 3 => 'three', 4 => 'four');
    and

    Code:
    $_GET
    instead of

    Code:
    $GET
    And some others, like unbalanced parentheses.

    Maybe it's better if you tell us what you are trying to accomplish here with your code, so that it's easier for us to help you.

    Edit 2: I forgot to add the last part The best way in this case is to probably use Javascript. Have a look at this article, maybe it's what you are looking for: http://www.cssnewbie.com/using-javas...tion-elements/

  3. #3
    SitePoint Evangelist runeveryday's Avatar
    Join Date
    Jul 2009
    Posts
    437
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    many thanks. i want to add class='active' to the menu. when the menu is the current page.namely. when i on the home page. the a label is
    <li class="item"><a href="/" class="active">Home</a>/</li>
    .but the others a label are not have class="active". when i on the Tab2 page. it is is
    <li class="item"><a href="two" class="active">tab2</a>/</li>
    .the others a label are not have class="active".

  4. #4
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,658
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)

  5. #5
    SitePoint Addict D3V4's Avatar
    Join Date
    May 2010
    Posts
    370
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by runeveryday View Post
    many thanks. i want to add class='active' to the menu. when the menu is the current page.namely. when i on the home page. the a label is .but the others a label are not have class="active". when i on the Tab2 page. it is is.the others a label are not have class="active".
    You were somehow on the right direction

    Quote Originally Posted by EricWatson View Post
    Point 3 in this article does what you were trying to do

  6. #6
    SitePoint Addict
    Join Date
    Dec 2005
    Posts
    336
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Try this:
    PHP Code:
    <html>
        <head>
            <style>
                .active { color: red; }
            </style>
        </head>
        <body>
        <?php

            $current 
    = array(
                
    "" => "Home",
                
    "two" => "Tab2",
                
    "three" => "Tab3",
                
    "four" => "Tab4"
            
    );
            foreach( 
    $current as $k => $v ) {
                
    $active $_GET['page'] == $k
                    
    ' class="active"'
                    
    '';
                echo 
    '<li class="item"><a href="/'$k .'"'$active .'>'$v .'</a></li>';
            }

        
    ?>
        </body>
    </html>


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •