Register Members List Search Today's Posts Mark Forums Read

Reply
 
Article Options
How To Highlight Current Item in a CSS Menu?
aveon
Join Date: May 2006
Posts: 410

by aveon aveon is offline 25 Jun 2007

Hello everyone!

This tutorial will show you how to highlight the current link on a css menu.

ok lets make a quick simple css menu...

CSS Starts

Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

Done With Css Menu...

Now Lets Create Our Html Menu...


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

Done With The HTML Menu.....

Now there are not many ways on vb to get the current link highlighted but we have if conditionals which will help us in this situation so first of all lets see the conditionals which will be helpful for us...

#1 Links Using the .php pages (#ex. search.php, index.php)

for .php pages every php page has a definition somewhere at the top of the .php file and that string goes like
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

the definition is located where the xxx is... and at this point the if conditional going to be


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

**if you have more than one .php files which u want to use on your menu your conditional string will go like
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

**

we are done for this point...

#2 Highlighting Forumdisplay Pages (#ex. forumdisplay.php?f=1)

this is going to be difficult for beginners because if you have a planny of forums in one category and u want the link to be highlighted for each of them it will take us some time to go over everyone of it but don't worry it is easy after you start... so here we go...

we will be using an if conditional for this one ass well... Our conditional will be
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

...

to apply this code in our menu we have to see the forum id's we can check them either in admincp or in forum itself.. ones u get the forumid's selected for our menu lets put them in our conditional...

main category id>> 1
sub categories>> 2, 3, 4, 5


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

this part is done ass well..

#3. How To Combine 2 Conditional Together...

if you want to use a .php file and a forumdisplay page for your menu you need to combine the two conditional together and it will going to look like;


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

and it is simple as that..

Now Lets Apply Our Conditional To Our CSS Menu;

Our Html Menu Was


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

**Now Lets Begin**

first link is
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

so lets apply the conditional...

our .php definition is 'index' so our if conditional will look like
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

and our menu going to be like


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

lets apply this on evey link which is using .php page...


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

Our Last Item was
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

.. So lets begin applying our conditional on our link...

we will be using
Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

and our menu is going to be


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

So Finally We Are Done!!

here is our html menu!


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

I Hope U Enjoyed it...

aveon...

Last edited by aveon; 26 Jun 2007 at 03:47..
Views: 5343
Reply With Quote
Comments
  #2  
Old 26 Jun 2007, 00:21
Alfa1's Avatar
Alfa1 Alfa1 is offline
 
Join Date: Dec 2005
To save some of you from carpal tunnel syndrome, here is a range of forumID's you can copy paste:

array(1 , 2, 3, 4 ,5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 34, 35, 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57, 58, 59, 60, 61, 62, 63, 64, 65, 66, 67, 68, 69, 70, 71, 72, 73, 74, 75, 76, 77, 78, 79, 80, 81, 82, 83, 84, 85, 86, 87, 88, 89, 90, 91, 92, 93, 94, 95, 96, 97, 99, 100, 101, 102, 103, 104, 105, 106, 107, 108, 109, 110, 111, 112, 113, 114, 115, 116, 117, 118, 119, 120, 121, 122, 123, 124, 125, 126, 127, 128, 129, 130, 131, 132, 133, 134, 135, 136, 137, 138, 139, 140, 141, 142, 143, 144, 145, 146, 147, 148, 149, 150, 151, 152, 153, 154, 155, 156, 157, 158, 159, 160, 161, 162, 163, 164, 165, 166, 167, 168, 169, 170, 171, 172, 173, 174, 175, 176, 177, 178, 179, 180, 181, 182, 183, 184, 185, 186, 187, 188, 189, 190))
Reply With Quote
  #3  
Old 25 Sep 2007, 13:34
ReQueM's Avatar
ReQueM ReQueM is offline
 
Join Date: Dec 2006
thank u aveon
__________________
ReQueM back!!!
Reply With Quote
  #4  
Old 17 Oct 2007, 14:56
KoC KoC is offline
 
Join Date: May 2005
Very important post. Thank you...
__________________
http://www.payidar.net

More and more..
Reply With Quote
  #5  
Old 10 Jan 2008, 23:46
blastup blastup is offline
 
Join Date: Feb 2007
that is freaken awesome thanks for this useful post..i used it and works great on my forum.. great tutorial .. a recommendation to all the people use the <else /> condition. if you say like you want the rest of the forum to display something use the <else />.so you do not have to define using individual ids .. it is just everything else.. alright peace out - if you need help let me know i own a webmasters forum at http://millionwebmasters.com
Reply With Quote
  #6  
Old 24 May 2008, 18:17
unleash unleash is offline
 
Join Date: Jan 2006
Thanks alot, this was very very helpful, i was looking for this
__________________
DDLTeam.com | Social Networking Site.
Reply With Quote
  #7  
Old 20 Feb 2009, 11:49
career career is offline
 
Join Date: Feb 2009
Thanks Aveon!
Reply With Quote
  #8  
Old 07 Apr 2009, 15:32
NetRover NetRover is offline
 
Join Date: Jul 2004
Awesome, thank you so much for this advice. I've manage nice active tabbed forums with subforums.

good stuff.
Reply With Quote
Reply



Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Article Options

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off


New To Site? Need Help?

All times are GMT. The time now is 16:51.

Layout Options | Width: Wide Color: