Custom Navigation

[Dfroemke]

Hello All,

Forgive my state of super green web guy.

I've just opened a SM account and find the tools to be awesome. Since I'm a total amateur I used the Dummies Guide to get myself moving with HTML and CSS. I've got some experience using FrontPage but that really doesn't count here.

Question: I'd like to use some simple jpgs as buttons for a horizontal navigation. I'm stumped at how to start.

I'd like something simlar to www.froemke.com/index2.htm (http://www.froemke.com/index2.htm)

My SM site is http://gallery.froemke.com (let me know what you think)

I'd love it if someone could point me to a great tutorial or sample of this.

Thanks

David

[SamirD]

Seems like you've already got it, unless you mean you want to use jpg graphics instead of yellow text boxes.

[Mike Lane]

Moved to customization.

You've got a great start I think David. You've done well following the tutorials. All you need to do to get the navbar that you're trying to get is to continue on with the navbar tutorials that I posted in the sticky thread at the top of the customization forum.

[Dfroemke]

Moved to customization.

You've got a great start I think David. You've done well following the tutorials. All you need to do to get the navbar that you're trying to get is to continue on with the navbar tutorials that I posted in the sticky thread at the top of the customization forum.


Mike,

Thanks for the help so far. I've read thru all of the nav links you've posted and I'm missing anything related to using a button in a nav? Can you be a bit more specific for me.

thanks

David

[Andy]

Mike,

Thanks for the help so far. I've read thru all of the nav links you've posted and I'm missing anything related to using a button in a nav? Can you be a bit more specific for me.

thanks

David


You have buttons in your navbar now, the big yellow ones :D are you looking to change them to a different look?

[Dfroemke]

You have buttons in your navbar now, the big yellow ones :D are you looking to change them to a different look?


Actually, those are a standard list with a background color. After some searching I've found that I would like to have those to have a more clean and neat look. I've seen some folks with what looks like a graphic image that looks like a full bar that fits snugly under the banner graphic.

An example is http://jos-echelpoels.smugmug.com/

thoughts?

Thanks

David

[Mike Lane]

Actually, those are a standard list with a background color. After some searching I've found that I would like to have those to have a more clean and neat look. I've seen some folks with what looks like a graphic image that looks like a full bar that fits snugly under the banner graphic.

An example is http://jos-echelpoels.smugmug.com/

thoughts?

Thanks

David

If you can use a background color, you can use a background image. Check out the menu that I created for http://www.pristine-light.com/ for an example of what you can do.

But get creative with CSS styles before you move to images. You can get some very neat looking menubars without using any images.

[Dfroemke]

If you can use a background color, you can use a background image. Check out the menu that I created for http://www.pristine-light.com/ for an example of what you can do.

But get creative with CSS styles before you move to images. You can get some very neat looking menubars without using any images.

That is very slick. I do like that it's not an image because things load so much faster.

I'll keep you posted.


Thanks fo the help

David

[Mike Lane]

That is very slick. I do like that it's not an image because things load so much faster.

I'll keep you posted.


Thanks fo the help

David

The pristine light navbar is infact an image (only one image though mind you).

[rwinslow]

I've created my navibars, but am unsure how to link text to them. I put some text in a private gallery, but that doesn't look right. Also, somehow I've done a left justification for everthing and want it centered. Can anyone out there help? :dunnoThanks.
www.robertwinslowphoto.com (http://www.robertwinslowphoto.com)

[ivar]

I've created my navibars, but am unsure how to link text to them. I put some text in a private gallery, but that doesn't look right. Also, somehow I've done a left justification for everthing and want it centered. Can anyone out there help? :dunnoThanks.
www.robertwinslowphoto.com (http://www.robertwinslowphoto.com)

Robert,

What exactly do you mean with linking text? do you mean how to link the buttons to a location? You seem to have that one down with your second link (photo tours).

If you want to center the menu, add the red:
<div id="navcontainer" align="center">
<ul>
<li><a href="Text%201">Contact Us</a></li>
<li><a href="http://rwinslow.smugmug.com/gallery/1321880">Photo Tours</a></li>
<li><a href="Text%203">Download Comps</a></li>
<li><a href="Text%204">Purchase a Print</a></li>
</ul>
</div>

Let me know what you mean with the linking.