Advertisement

Highlight Current Active Navigation Link - Step 2 - PHP

Highlight Current Active Navigation Menu Link using PHP Xhtml and CSS

Now that our Page is ready, we need to integrate our menu in that page.

Step 2: PHP

To do this, open the home.php again, and at the top of the page, before anything, add this PHP code:
PHP Code :

<?php
define('THIS_PAGE', 'home');
?>

By using this code, we defined that current page is ‘home’
You will need to add this code to every Page that is linked in your navigation bar, replacing the ‘home’ with the name you want to give to that page.
For Example:
You are adding the code to portfolio.php
In this case, You will need to replace the ‘home’ with ‘portfolio’, so your code will look like this:
PHP Code :
<?php
define('THIS_PAGE', 'portfolio');
?>

After adding the code to each page, we will integrate our menu into our pages.
To do this, open your home.php file, and find this text :

<!--content-->

Replace it with this PHP Code:
PHP Code :

<?php
include "menu.php";
?>

This will add our menu in our home.php, repeat this process for every page.
Now we are almost done, we just need to highlight the currently active link.
So, to do that, open the menu.php, and make these edits:
Find this Text:

class="home"

Repace it with :

class="<?php echo THIS_PAGE == 'home' ? 'current' : 'link'; ?>"

Repeat this Process with every <li> class, replacing the ‘home’ with the name which you defined earlier for each page.
For Example:
If you are replacing class=”portfolio”, you must replace it with :

class="<?php echo THIS_PAGE == 'portfolio' ? 'current' : 'link'; ?>"

After replacing every <li> class, Save the menu.php file.
And Viola ! Our Dynamic Navigation bar is ready !
Enjoy it !

Related Tutorials



2 responses. Wanna say something?

    Comment #1
  1. PHP Freelancer
    Posted on Jun 19, 2008 at 15:19:37

    Hi,
    Quite useful. I have just declared two variables i each page since i am using main and sub menu. Thanks a lot :)

  2. Comment #2
  3. Wolven
    Posted on Jul 3, 2008 at 19:29:24

    Thanks for this tutorial, just what I was looking for.

Post a Comment