Graphics navigation menu - how?

Jorgen / 2007-10-05 08:41:06   

I would like to change the text in the navigation menu into graphics/buttons like this:http://www.goodinc.nl/

but where do I find the file that generates the navigation??
Dont have a clue.... can anybody give me a hint?

Thanks

Jorgen

Vaska A / 2007-10-05 09:52:09   

That's just text. He edited up his CSS to make it that way.

Jorgen / 2007-10-05 11:15:33   

Hi Vaska

thank you for answering so promptly - I see now its ’just’ exellent CSS-coding. I think I have seen other indexhibit-based sites with the menu as graphic buttons, but now I can’t find them.

But am I right when I presume that I wont find a file somewhere in the uploaded folders, which make it possible to edit the navigation - everything has to be done with CSS?

The sames goes with the possibilty to move the submenu into a second column - ala studiofeed.ca - thats css/coding too, am I right?

Vaska A / 2007-10-05 12:04:29   

Yes, things are done with CSS. You can write a new script for outputting the Index - but you need coding skills for that.

Studiofeed wrote their own templates to do that - it's custom code (not simply just css).

Nicolasbulb / 2007-10-05 14:02:49   

Where do you add a href to redirect to the home page when clicking to a custom logo button in the pre/nav setting: img src=filepath width="89" height="33" ???

Many thanks.

Nicolas

Vaska A / 2007-10-05 14:53:12   

Eh? You mean like...


<a href='/'>
<img src='/files/img.jpg' width='89' height='33' border='0' />
</a>

Vaska A / 2007-10-05 14:53:43   

Well, without the line breaks...should all be one line without any breaks.

Nicolasbulb / 2007-10-05 15:18:34   

Perfect. One more thing on this subject though.
how do you proceed to have a different css instance for the styles.css a:hover. How to bypass it just for the pre/nav?

Thanks.

Nicolas

nils / 2007-10-05 15:48:18   

In your Style.css ...


#menu ul a:hover { your:css(code);

}

nils / 2007-10-05 16:03:53   

Oh sorry in your prev/nav!? ...

style.css
.prevnav a:hover {your css style}

prev/nav

<link class="prevnav">

Nicolasbulb / 2007-10-09 18:42:56   

Hello Nils,

I've tried your code but I can't make it work.
I'm trying to bypass the menu hover and the a:visited:
here are my settings:
a:hover {border-bottom: 4px solid #000;}
a:visited { color: silver;border-bottom: 1px dotted black;text-decoration: none;}

I've add the link to my prevnav:

nils / 2007-10-11 15:40:40   

In your Prev/Nav field ...



<span class="menulink">
Your Links
</span>

...in your Style.css add this:

.menulink a:link, a:visited{color: silver;border-bottom: 1px dotted black;text-decoration: none;}

.menuelink a:hover {border-bottom: 4px solid #000;}

nils / 2007-10-11 15:42:26   

.menulink a:hover {border-bottom: 4px solid #000;}

*without "e" :)

This thread has been closed, thank you.