Page 1 of 1

How to make a link in menu that changes stylesheet

Posted: Sat May 03, 2008 8:19 am
by Evert B.
Hello,

None of the Dutch people could help me so I try here.
I am making a site for two brothers with a horizontal menu and left vertical submenu. In the horizontal menu it says 'brother one' and 'brother two'.
I would like to have different appearance after you have clicked on 'brother one' or 'brother two'. My guess is that this should be done with a stylesheet that is linked to that hyperlink.
Who knows how to help me?

Thanks and best regards - Nuc

Re: How to make a link in menu that changes stylesheet

Posted: Sat May 03, 2008 9:29 am
by nils73
You do not need a different stylesheet. What you need are more precise selectors. Let's say you have a navigation called #nav-main. For brother 1 the menu should be yellow with black font. And for brother 2 you would like to have the navigation in red with white font. Here is what you need to do:

Inside of -tag create a "signature", that is to say, an id. For example you could use a user-defined-tag to get the parent-id of your sub-navigation-element. There is a user-defined-tag called Get a page's root parent's alias that does exactly that. So now you have a body that is called

in the template

and

when it is rendered in source-code.

Now all you have to do is to change your stylesheet:

#brother1 #nav-main { background: yellow; color: black; }
#brother2 #nav-main { background: red; color: white; }

CSS allows you to be as specific as you like and the more specific you are the more options you have in styling your website.

Hope that helps.
Nils