Saturday, 17 March 2012

Creating Menu Using PHP and html & Highlight current page

very simple to create menu using php. just follow the below step and you are done.


















To create menu with this example you need to define all the page with the following :


say for example your are in the home page


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


define all pages with define() php function
Now create one menu.inc file :


<style>
.siteNav { padding: 0; margin: 0; }
.siteNav ul { margin: 0; padding: 0; }
.siteNav li { margin: 0; padding: 0; display: block; float:left; text-align: center; }
.siteNav a { background:url(images/navbuttongreen.gif) no-repeat; color : #fff; text-decoration: none; font-weight: bold; display: block; height: 26px; width: 94px; line-height: 26px; }
.siteNav ul li a:visited { background:url(images/navbuttongreen.gif) no-repeat 0px 0px; color: skyblue; height: 26px; width: 94px; line-height: 26px; }
.siteNav ul li a:hover { background:#F87B27; color: #fff; height: 26px; width: 94px; line-height: 26px; }
.siteNav ul li a:active { background:url(images/navbuttongreen.gif) no-repeat 0px 0px; color: lime; height: 26px; width: 94px; line-height: 26px; }
 
#sectionhome #menuhome a,
#sectionabout #menuabout a,
#sectionservices #menuservices a
{ background:url(images/navbuttonorange.jpg) no-repeat 0px 0px; color: lime; height: 29px; width: 94px; line-height: 29px; padding-top: 0px; margin-top: -3px; cursor: default; }

</style>

<?php
define('THIS_PAGE', 'pagename');
 
$menuitem1 = '<a href="highlighthome.php">Home</a>';
$menuitem2 = '<a href="highlightabout.php">About Us</a>';
$menuitem3 = '<a href="highlightservices.php">Services</a>';
 
switch (THIS_PAGE) {
 
case 'Home':
$menuitem1 = '<a style="background: #1A4572 url(current.jpg) no-repeat top left; color: #fff; height: 29px; width: 94px; line-height: 29px; padding-top: 0px; margin-top: -3px; cursor: default;" href="#nogo">Home</a>';
break;
 
case 'About':
$menuitem2 = '<a style="background:#1a4572 url(current.jpg) no-repeat top left; color: #fff; height: 29px; width: 94px; line-height: 29px; padding-top: 0px; margin-top: -3px; cursor: default;" href="#nogo">About Us</a>';
break;
 
case 'Services':
$menuitem3 = '<a style="background:#1A4572 url(current.jpg) no-repeat top left; color: #fff; height: 29px; width: 94px; line-height: 29px; padding-top: 0px; margin-top: -3px; cursor: default;" href="#nogo">Services</a>';
break;
 
default:
break;
}
 
echo '<ul>
<li>'.$menuitem1.'</li>
<li>'.$menuitem2.'</li>
<li>'.$menuitem3.'</li>
</ul>';
?>


Create pages like highlighthome.php, highlightservices.php, highlightabout.php 


highlighthome.php :



<html>
<head><title>Home</title></head>
<body style="background:#1a4572">
    <div class="siteNav noborder">
           <?php
                  define('THIS_PAGE', 'Home');
                  include('menu.inc');
           ?>
     </div>
</body>
</html>
highlightabout.php :


<html>
<head>
</head>
<body style="background:#1a4572">
    <div class="siteNav noborder">
           <?php
                  define('THIS_PAGE', 'About');
                  include('menu.inc');
           ?>
     </div>
</body>
</html>


highlightservices.php

<html>
<head><title>Home</title></head>
<body style="background:#1a4572">
    <div class="siteNav noborder">
           <?php
                  define('THIS_PAGE', 'Services');
                  include('menu.inc');
           ?>
     </div>
</body>
</html>