CODEWITHSUNDEEP
phphtmlcssnavigation
ToniHopkins
ToniHopkins

Reputation: 369

PHP navigation menu

I am making a website as part of a college assignment. I have a navigation list for my pages styled using CSS so when a page is selected the link appears bold with an image beside. I was wanting to keep the style of this menu however move this part of the html code to a .php file and just include it on each of the pages for code re-use.

Easy enough to do however because I have a class set to determine which page is selected an change the look of the link how would I go about passing this to the PHP file - Is it possible?

Code snippets below...

HTML list currently:

<ul>
    <li class="selected"><a href="index.html">Home</a></li>
    <li><a href="login.html">Members Login</a></li>
    <li><a href="#">Music Categories</a></li>
    <li><a href="#">Contact Us</a></li>
</ul>

CSS for the selected page:

nav ul li.selected a
{
color:#fff;
font-weight:bold;
background:url(images/music_note2.png) center left no-repeat;
}

Is there some sort of code I can use the pass the name of the page? Appologies I have never used php. Not sure if it matters but later on I will need to also hide or show certain links on the menu depending on whether the user is logged in

Upvotes: 0

Views: 4809

Answers (2)

jeroen
jeroen

Reputation: 91734

You can do it in just css if you want to. Just add a class to the body of every page like home to home, contact to contact, etc.

<body class="home">    // for home page
   ...

<body class="contact">    // for contact page
   ...

Then you add the same classes to your navigation like:

<ul>
    <li class="home"><a href="index.html">Home</a></li>
    <li class="login"><a href="login.html">Members Login</a></li>
    <li class="music"><a href="#">Music Categories</a></li>
    <li class="contact"><a href="#">Contact Us</a></li>
</ul>

Now you can highlight your active menu item like:

.home .home a,
.login .login a,
.music .music a,
.contact .contact a {
  color:#fff;
  font-weight:bold;
  background:url(images/music_note2.png) center left no-repeat;
}

Upvotes: 3

Marc B
Marc B

Reputation: 360672

Simplest method is to simply set a variable that your included menu file checks for:

<?php
$cur_page = 'home';
include('menu.php');

and then in menu.php

<li<?php echo ($cur_page == 'home') ? ' class="selected"' : '' ?>><a href etc.....
<li<?php echo ($cur_page == 'members') ? ' class="selected"' : '' ?>> etc....

Upvotes: 2

Related Questions