Jump to content
  • Checkout
  • Login
  • Get in touch


The e-commerce.

Top Horizonal Nav Bar?


Recommended Posts


Im just wondering with the default oscommerce template, there is a greyish purple nav bar that has My account, cart contents, and checkout written on it.

What i would like to do is replace that with a series of images (different links to different catergories of products) Aswell as get rid of the text that is there. So far i have teken all the text out, and added my images, however i cant seem to change that color of that grey to a basic white. Would that be in the style sheet? the header.php...or somewhere else?

What should i look for?


Thanks! :thumbsup:

Link to comment
Share on other sites

Also, theres an image in the header i changed, and iwanted to change the url aswell


. tep_href_link(contact, '', 'SSL') . '">' .

How do i make it so it can point to a .html? I tried to add contact.html, however it changes it to contacthtml and dosnt work.

Link to comment
Share on other sites

thanks thats exactly what i needed :)

However is there a way to get rid of that backspace compelty?

I added my nav bar image there, and turned that grey into a white, however than i put images under that bar, but theres alittle white space, i want no white space. I tried to chage the hieght to 0,1,2..etc, however the space was never compelty gone

Link to comment
Share on other sites

the grey bar is set in the stylesheet (/catalog/stylesheet.css). Find the two headerNavigation classes and remove the background style from both.



Sorry :P

Theres a link, u see the nav bar i have there with the dogs, cats..etc

than that red bar about shipping, and how theres a small space between it. I want no space at all, is that possible? Also i edited it in the header.php, however i used html to add the images and such, as im not very expirenced in php, is that okay to do?

Link to comment
Share on other sites

you are getting the space there because that red bar image has two pixels of whitespace at the top. Remove that.


Also change this:


<table width="100%" height="2%" border="0" cellpadding="1" cellspacing="0">


to this:


<table width="100%" height="2%" border="0" cellpadding="0" cellspacing="0">

Link to comment
Share on other sites


Yeah the red bar has alittle bit of white space. That is part of the design, however the sapce between the red bar and the nav is bigger than that white space. Theres an extra 2+ pixels of space that is not part of the design.

The cell padding didnt make a difference either.

Its not really a big idea, just wanted the site to be exact as to the design



Link to comment
Share on other sites

it's fine in Firefox. Only in IE do you get the extra whitespace. This can be fixed by removing the whitespce from the code itself:


<table width="100%" height="0%" border="0" cellpadding="0" cellspacing="0">

<tr class="headerNavigation">

<td height="100%" class="headerNavigation"><a href="http://mypetstuff.ca/catalog/index.php?cPath=21"><img src="http://www.mypetstuff.ca/images/dogs.gif" border="0" /></a><a href="http://"><img src="http://www.mypetstuff.ca/images/cats.gif" border="0" /></a><a href="http://"><img src="http://www.mypetstuff.ca/images/small.gif" width="136" height="25" border="0" /></a><a href="http://"><img src="http://www.mypetstuff.ca/images/birds.gif" border="0" /></a><a href="http://"><img src="http://www.mypetstuff.ca/images/fish.gif" border="0" /></a><br><img src="http://www.mypetstuff.ca/images/content_19.gif" width="686" height="12" /><br /><img src="http://www.mypetstuff.ca/images/content_20.gif" width="466" height="15" /><a href="http://"><img src="http://www.mypetstuff.ca/images/shipdetails1.gif" width="65" height="15" border="0" /></a><img src="http://www.mypetstuff.ca/images/content_22.gif" width="155" height="15" /></td>

<td align="right" class="headerNavigation"> </td>


Link to comment
Share on other sites


This topic is now archived and is closed to further replies.

  • Create New...