Printable View
hi friends
i need small help
http://kenrock.com.pk/ open this plz
suppose home page opened , i want to make "home" text color in menu "white"
or any active page like
http://kenrock.com.pk/completedProjects.html active page "completed projects" its color should be changed into white... because its active page
user get to know, its in which page
thanks,waiting
It's easy with CSS. Firstly, add a special class to each link. E.g.
Then add this to your CSS:Code:<ul>
<li><a class="home" href="index.html">Home</a></li>
<li><a class="com" href="completedProjects.html">Completed Projects</a></li>
<li><a class="cli" href="clientele.html">Clientele</a></li>
<li><a class="sta" href="keystaff.html">Key Staff</a></li>
<li><a class="equ" href="equipment.html">Equipment</a></li>
<li><a class="con" href="contact.html">Contact Us</a></li>
</ul>
Then on the Home page, add the same class to the <body> tag:Code:.home #mainMenuContainer ul li a.home, .com #mainMenuContainer ul li a.com, .cli #mainMenuContainer ul li a.cli, .sta #mainMenuContainer ul li a.sta, .equ #mainMenuContainer ul li a.equ, .con #mainMenuContainer ul li a.con {
color: white;
}
and put the equivalent class on the body tag for each other section. E.g. all pages in the Key Staff section all have this on the <body> tag:Code:<body class="home"
Code:<body class="sta">
thanks,first i thought similar thing, but i thought , any small other trick might beQuote:
Originally Posted by ralph.m
but now i ve to add this code on all pages :(
thanks a lot sir
Cool, glad it worked. Why the sad face?
no i am not sad :) happy thanksQuote:
Originally Posted by ralph.m
I dislike the dual class approach myself -- but then I really don't tend to think of a lot of legitimate reasons to put a ID or class on BODY. Usually I just put a class of 'current' on the current menu item server-side in the markup. It's easier to style for, less confusing, and less code.
can you give me an exampleQuote:
Originally Posted by deathshadow60
Well, my menus are usually built off a PHP array... so... well, I'll pull it from the codebase I'm working on right now -- this is PHP so it's a wee bit more complex, but you'd have to swap the ID on body anyways for each page so it's not that different. I'll simplify it down a little.
I typically have an associative array of URL => description:
(this array is usually built or added to dynamically by my back-end code)Code:$mainMenu=array(
'/' => 'Home',
'/forums' => 'Forums',
'/technical' => 'Technical Reference',
'/about' => 'About Us'
);
Which I then iterate through to echo out.
With a variable $currentURL which equals the current page minus the domain.Code:echo '
<ul id="mainMenu">';
foreach ($mainMenu as $url => $text) {
echo '
<li><a href="',htmlspecialchars($url),'"',(
$text==$currentURL ? ' class="current"' : ''
),'>',$text,'</a></li>';
}
echo '
</ul>';
So when $currentURL=="/" it outputs:
When $currentURL=="/technical"Code:<ul id="mainMenu">
<li><a href="/" class="current">Home</a></li>
<li>a href="/forums">Forums</a></li>
<li>a href="/technical">Technical Reference</a></li>
<li>a href="/about">About Us</a></li>
</ul>
So on and so forth. Bit more code on the back end, but reallyCode:<ul id="mainMenu">
<li><a href="/">Home</a></li>
<li>a href="/forums">Forums</a></li>
<li>a href="/technical" class="current">Technical Reference</a></li>
<li>a href="/about">About Us</a></li>
</ul>
Is WAY easier to deal with than the headache of going:Code:.current {
Especially since it lets me add or remove items with impunity without worrying about adding/removing them from the CSS. Having to modify the CSS just because you want to add a new menu item is... well... indicative of failing to future-proof.Code:#home .home,
#forums .forums,
#technical .technical,
#about .about {
Nice work, DS; though it depends on the site being set up like that from the outset. I guess another way to do it with PHP on an already created site would be something like this (though I'm sure you could improve on it, me bein' a noob'n'all):
PHP Code:<?php $currentPage = basename($_SERVER['SCRIPT_FILENAME']); ?>
<ul>
<li><a href="index.html" <?php if ($currentPage == 'index.html') {echo 'class="current"';} ?>>Home</a></li>
<li><a href="completedProjects.html" <?php if ($currentPage == 'completedProjects.html') {echo 'class="current"';} ?>>Completed Projects</a></li>
<li><a href="clientele.html" <?php if ($currentPage == 'clientele.html') {echo 'class="current"';} ?>>Clientele</a></li>
<li><a href="keystaff.html" <?php if ($currentPage == 'keystaff.html') {echo 'class="current"';} ?>>Key Staff</a></li>
<li><a href="equipment.html">Equipment</a></li>
<li><a href="contact.html" <?php if ($currentPage == 'equipment.html') {echo 'class="current"';} ?>>Contact Us</a></li>
</ul>
Well, it's not bad, though I'd probably have that ALL in a echo statement since I consider opening and closing php like that to be bad coding practice -- but again I'm in favor of having <?php and ?> removed from PHP entirely. Would speed it up, plug a number of security holes, make the folks at turdpress have to throw out their entire codebase and maybe try writing code properly for a change...
My approach would probably use inline evaluations like this:
Code:<?php
$currentPage = basename($_SERVER['SCRIPT_FILENAME']);
echo '
<ul>
<li><a href="index.html"',(
$currentPage=='index.html') ? ' class="current"' : ''
),'>Home</a></li>
<li><a href="completedProjects.html",(
$currentPage=='completedProjects.html' ? ' class="current"' : ''
),'>Completed Projects</a></li>
<li><a href="clientele.html",(
$currentPage=='clientele.html' ? ' class="current"' : ''
),'>Clientele</a></li>
<li><a href="keystaff.html",(
$currentPage=='keystaff.html' ? ' class="current"' : ''
),'>Key Staff</a></li>
<li><a href="equipment.html",(
$currentPage=='equipment.html' ? ' class="current" : ''
),'>Equipment</a></li>
<li><a href="contact.html",(
$currentPage=='contact.html' ? ' class="current" : ''
),'>Contact Us</a></li>
</ul>';
?>
Though really that's a lot of redundant code.... I'd probably still build an array first... just to make it a loop and eval for less total code.
It would also make adding/removing menu items a lot simpler since you would just add the url and title to the array, then let the loop handle the markup.Code:$mainMenu=array(
'index.php' => 'Home'
'completedProjects.php' => 'Completed Projects',
'clientele.php' => 'Clientele',
'keystaff.php' => 'Key Staff',
'equipment.php' => 'Equipment',
'contact.php' => 'Contact Us'
);
echo '
<ul id="mainMenu">';
foreach ($mainMenu as $title => $url) {
echo '
<li><a href="',$url,'"',(
$currentPage==$url) ? ' class="current"' : ''
),'>',$title,'</a></li>';
}
echo '
</ul>';
Could take it even further and use that same array to build your TITLE attribute.
Though that's treading into starting to build your own CMS... which isn't necessarily a bad thing given the quality of most of the off the shelf ones.Code:<?php
$siteTitle='Name of the website';
$mainMenu=array(
'index.php' => 'Home'
'completedProjects.php' => 'Completed Projects',
'clientele.php' => 'Clientele',
'keystaff.php' => 'Key Staff',
'equipment.php' => 'Equipment',
'contact.php' => 'Contact Us'
);
$currentPage = basename($_SERVER['SCRIPT_FILENAME']);
$currentTitle=isset($mainMenu[$currentPage]) ? $mainMenu[$currentPage] : '';
if ($currentTitle=='Home') $currentTitle='';
echo '
<title>
',(is_empty($currentTitle) ? '' : $currentTitle.' - '),$siteTitle,'
</title>
</head><body>
<h1>',$siteTitle,'</h1>
<ul id="mainMenu">';
foreach ($mainMenu as $title => $url) {
echo '
<li><a href="',$url,'"',(
$currentPage==$url) ? ' class="current"' : ''
),'>',$title,'</a></li>';
}
echo '
</ul>';
?>
That's fine if you're using PHP, but I mostly go for a much simpler approach and use SSIs to pull in the menu, meaning that the only effective way to achieve that result is to put a class/ID on the <body>. It works fine, it doesn't cause any problems, I see nothing wrong with it as an approach.Quote:
Originally Posted by deathshadow60
Wait, people still use SHTML? Kidding.Quote:
Originally Posted by Stevie D
You're right, within the limitations of SHTML that's really the best (only?) option; though I HATE what it does in the CSS AND the markup since it reeks of 'slap values on EVERYTHING'.
Sooner or later it's time to strap on the big boy boots.
Thanks for all those demos, Jason. For someone just learning PHP, they are fascinating and very educational. :)
I really do like Jasons first one with setting the variables to different values. I use that currently on my site to indicate activity among certain pages.Quote:
Originally Posted by Stevie D
It's annoying to have to have an if statement everywehre by it adds dynamictivity to it :)
Why not? It does everything I need it to do on those sites. Why make things more complicated than they need to be?Quote:
Originally Posted by deathshadow60
Nothing wrong with it, I've just not seen anyone actually use it in five or six years. Kinda like coldfusion -- you just don't see it being used unless it's an older site.Quote:
Originally Posted by Stevie D
@aliqayyum.
I use a similar stand-alone file which is included in every page:
# Style-sheet.css
HTML Code:#sp-menu li {display:inline-block; padding:0 1em}
#sp-menu #active {color:#900}
# Files: home, complete, client, key-staff, equipment, contact-us
PHP Code:
<!--Start of Main Menu-->
<div id="mainMenuContainer">
<?php include 'incs/__sp-menu.php';?>
</div>
# File: 'incs/__sp-menu.php'
PHP Code:<?php
$a=array
(
'home' => 'Home',
'complete' => 'Completed Projects',
'client' => 'Clientele',
'key-staff' => 'Key Staff',
'equipment' => 'Equipment',
'contact-us' => 'Contact Us',
);
$rqst = $_SERVER['REQUEST_URI'];
echo '<ul id="'sp-menu">';
foreach( $a as $url => $title):
# Maybe active page
if( ('/'==$rqst && 'home' == $url) || strpos( $rqst, $url ) )
{
$title = '<stong id="active">' .$title .'</strong>';
}
echo '<li><a href="' .$url .'">' .$title .'</a></li>';
endforeach;
echo '</ul>';