I have four php pages, homepage.inc.php, about.inc.php, contact.inc.php and heres my index.php
<div id="menu">
<nav>
<a id="home" target="_self" href="index.php">Home</a>
<a id="about" target="_self" href="index.php?p=about">About us</a>
<a id="contact" target="_self" href="index.php?p=contact">Contact</a>
</nav>
</div>
<div id="content">
<?php
$pages_dir = 'pages';
if (!empty($_GET['p'])) {
$pages = scandir($pages_dir, 0);
unset($pages[0], $pages[1]);
$p=$_GET['p'];
if(in_array($p.'.inc.php', $pages)){
include($pages_dir.'/'.$p.'.inc.php');
}else {
echo 'Sorry, page not found.';
}
}else{
include($pages_dir.'/home.inc.php');
}
?>
</div>
this is my css active{background:gray;} I want to add an active class on my menu. How?
You can do something like this:
<a id="contact" target="_self" href="index.php?p=contact" <?php if ($_GET['p'] == "contact") {
echo 'class="active"';
} ?> >Contact</a>
Or using short hand PHP (making the code look cleaner)
<a id="contact" target="_self" href="index.php?p=contact"<? (($_GET['p']=="contact") ? 'class="active"' : '') ?>>Contact</a>
Or you can use some JavaScript with JQuery:
<script>
$('#<?php echo $_GET['p'] ?>').addClass('active');
</script>
change your code as shown below ">Home ">About us ">Contact
<?php
$homeCls = '';
$aboutCls = '';
$contactCls= '';
$pages_dir = 'pages';
if (!empty($_GET['p'])) {
$pages = scandir($pages_dir, 0);
unset($pages[0], $pages[1]);
$p=$_GET['p'];
if($p == '') {
$homeCls = 'active';
} else if($p == 'about'){
$aboutCls = 'active';
} else if($p == 'contact'){
$contactCls= 'active';
}
if(in_array($p.'.inc.php', $pages)){
include($pages_dir.'/'.$p.'.inc.php');
}else {
echo 'Sorry, page not found.';
}
}else{
include($pages_dir.'/home.inc.php');
}
?>