Custom Navigation Highlight image

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Post Reply
ethical
Forum Members
Forum Members
Posts: 45
Joined: Fri Jan 12, 2007 11:48 pm

Custom Navigation Highlight image

Post by ethical »

Hi There,

Using version 1.02

I have a custom design that I plugged into CMSMS and I use Images for my roll over navigation buttons (she wanted a funky font). All the results i found in the forum seemed to be relating to the css menu and not related to images.

I want each menu item to stay highlighted when the user is on that page. I am pretty sure this can be done with some simple if/else statements, but not quite sure how to get started. I can edit code just can't create it myself! lol

here is a code snippit: The is the way i do it in My wysiwyg editor. The first menu item is the page I am on (always highlighted) the second is just normal roll over. Any advice would be greatly appreciated.

Thanks

John

Code: Select all

<tr>
		<td>
			<a href="index.htm">
				<img name="rovingvet_09" src="images/rovingvet_09-over.gif" width="175" height="29" border="0" alt="Home"></a></td>
		</tr>
	<tr>
		<td>
			<a href="thedoctor.html"
				onmouseover="changeImages('rovingvet_11', 'images/rovingvet_11-over.gif'); return true;"
				onmouseout="changeImages('rovingvet_11', 'images/rovingvet_11.gif'); return true;">
				<img name="rovingvet_11" src="images/rovingvet_11.gif" width="175" height="28" border="0" alt="About Dr. Susan Krakauer"></a></td>
	</tr>
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: Custom Navigation Highlight image

Post by Dr.CSS »

Do you have a link, if you use the menu manager you should/could be getting a class of menuactive or currentpage if not you can code it into a modified menu template...
ethical
Forum Members
Forum Members
Posts: 45
Joined: Fri Jan 12, 2007 11:48 pm

Re: Custom Navigation Highlight image

Post by ethical »

no I am not using the menu manager. I just pasted all my html into the template including the menu area.

here is the site: http://www.rovingvet.com/cms/

i didn't think i would be able to put my custom nav into the cms? should I? would that be easier than if statements?
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: Custom Navigation Highlight image

Post by Dr.CSS »

You should use the menu manager unless you want to hand code all the menus every time you add a new page, I can see how that would be fun after you add the 40th page and have to go back thru and change it again and how are you going to make it know that the page it's on is the active page...

The menu manager can take a lot of modifications such as ids and classes and make what you want done happen easily...

Your layout can be done in divs w/o table base layout easily enough, tables are hard for accessibility reasons, since you aren't using a flexible layout just take all the head images and stitch them together and put them in the header and use classes and ids in the menu to get your images and it can dynamically call the current page for the active menu item...

for samples of the way the menu gets the current page look at some default install pages in source view, noting how the menu calls the active page...
ethical
Forum Members
Forum Members
Posts: 45
Joined: Fri Jan 12, 2007 11:48 pm

Re: Custom Navigation Highlight image

Post by ethical »

Hi Mark,

thanks for your reply. I would love to rework the size in div's but the client is not paying me for that. I've already spent too much time redoing her design many times (its what she wanted, it looked a lot better 3 revisions ago). Also Image ready outputs in tables so that's what I use.

To be honest i took a look at the samples and really don't see how to adapt it to my site. Isee the class calls but seems like it would involve redoing the entire navigation system anyway? She is not going to be adding 40 pages to her site, once its built she will just use it to edit her existing text and images. Yes if she was i would be more concerned about using the menu manager which is why I asked about adding an if statement.

I don't understand the rest you said about stitching images?? All the examples have text navigation and roll overs and plus how would i add the rest of my left table in the menu area?

I got it figured out with if statements for now except for the home page index.php because that does not have a page= id?. thoughts?

If there is an easy way to explain how to do it otherwise as i didn't understand what you said (or point to where it would explain) I would appreaciate that.

thanks for your help

cheers
Last edited by ethical on Wed Jan 17, 2007 9:40 pm, edited 1 time in total.
ethical
Forum Members
Forum Members
Posts: 45
Joined: Fri Jan 12, 2007 11:48 pm

Re: Custom Navigation Highlight image

Post by ethical »

awesome! thank you. That worked great the page_alias function did the trick for the home page.

question is should i use it for all the pages, is it a better idea than using

if $page= "page-name"

thanks

john
Post Reply

Return to “Layout and Design (CSS & HTML)”