Nav Bar and Link Problems

[seethrou]

Oops!

Missing the file loacation,
copy the following file from
includes/templates/template_default/common/tpl_header.php

And save to your override directory
includes/templates/YOUR_TEMPLATE/common/tpl_header.php

Then modify the code there.

.

[chemdata]

Seethrou, thanks! That resolved my problem with respect to the nav bar links at the top which now show correctly as: Home | Log In | Shopping Cart | Checkout

Can something similar be done for the category links that are directly below the logo image? I couldn't locae a file similar to the tpl_header,php. Also in FireFox it seems that the the category nav bar follows to the right (next to) the logo image and spills over onto the next line. It doesn't look like its picking up the background color (#000000) of the space in which the logo image is in.

Once again thanks.

[seethrou]

Can something similar be done for the category links that are directly below the logo image? I couldn't locae a file similar to the tpl_header,php.

Copy the file below, save it to your override directory
includes/templates/template_default/templates/tpl_modules_categories_tabs.php

And save as:
includes/templates/YOUR_TEMPLATE/templates/tpl_modules_categories_tabs.php
In the new file, around line 21

<li><?php echo $links_list[$i];?></li>

change to

<li><?php echo $links_list[$i];?></li>|

Also in FireFox it seems that the the category nav bar follows to the right (next to) the logo image and spills over onto the next line. It doesn't look like its picking up the background color (#000000) of the space in which the logo image is in.

By veiw your site's page source, you have

<!--bof-branding display-->

<div id="logoWrapper">

    <div id="logo"><a href="http://fotopoet.com/zencart/"><img src="includes/templates/my_template/images/logo.gif" alt="Powered by Zen Cart :: The Art of E-Commerce" title=" Powered by Zen Cart :: The Art of E-Commerce " width="750" height="136" /></a></div>

    <div id="taglineWrapper">


      <div id="tagline">TagLine Here</div>



    </div>

</div>

<div class="clearboth"></div>

<!-- <br class="clearBoth" /> -->

<!--eof-branding display-->

Please note in the end of above code, there are two pieces of code:
1. <div class="clearboth"></div>
2. <!-- <br class="clearBoth" /> -->

May be you had changed the code there, please change back to only one of:
<br class="clearBoth" />

Then the catagories tab menu should change back to normal.

And add the following to your stylesheet to cover the blank area if any.

#headerWrapper {
background-color: black; /* change to the color you prefer */
}

#logo {
text-align: center;
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
PADDING-BOTTOM: 0px;
VERTICAL-ALIGN: middle;
PADDING-TOP: 0px
}

Hope this helps.

[chemdata]

Seethrou once again thank you. Your instructions corrected everything. I note that each browser is interpreting the code slightly difference. Oh for a tower of babel that would have all browsers talking the same tongue. Everything in FireFox is exactly the way I want it to be. It even gets the correct colors for the two links which are on the left and right side of the page. These are "new products (more)" and "shipping cart (more)" respectively. In MSIE I was able to set the hover color to what I wanted it just accepts the color of all the other links on the page and not to what I want.

Additionally, in MSIE its keeping that line in black below the logo image about 10px in height. Is there a way to make this line 1 px in height.

Also is there a book out there that will explain the ins and out of zencart and in particular its coding so that someone like myself (novice) can understand it. I hate having to come back continously and impose on everyone without at least making an effort to learn what I am doing.

[seethrou]

I note that each browser is interpreting the code slightly difference. Oh for a tower of babel that would have all browsers talking the same tongue. Everything in FireFox is exactly the way I want it to be. It even gets the correct colors for the two links which are on the left and right side of the page. These are "new products (more)" and "shipping cart (more)" respectively. In MSIE I was able to set the hover color to what I wanted it just accepts the color of all the other links on the page and not to what I want.

This is why many adviced that start from Firefox first and hack IE later.

Additionally, in MSIE its keeping that line in black below the logo image about 10px in height. Is there a way to make this line 1 px in height.

Since in Firefox you have the effect you want, for IE6 or IE add the following to your stylesheet and fine tune it.

/* For IE6 or IE only */
* html #navCatTabsWrapper {
TEXT-ALIGN: center;
margin-top: -14px; /* please not the negative sign */
}

Also is there a book out there that will explain the ins and out of zencart and in particular its coding so that someone like myself (novice) can understand it. I hate having to come back continously and impose on everyone without at least making an effort to learn what I am doing.

Franky, I am not a expert. Before the found out of Zen Cart, I knew nothing about the webs other than the uses of email and surf the internet. And almost what I know coming from this forum.

About the books, docs, guide or informations, it is very important and we all know that. But I think it is not the most important for learning, and when or how to use them are another things.

Why?
Long story short, I can only tell that observations, practices and grasp the basic concept are more important than others.
For adults in learning, a common problem or barrier is the requiring of "safety feelings". And this easily turn us to ask "Hey, what is the docs?"

Just a simple example, I always read the docs for instructions to prevent troubles.
But my kids just said "Why not try it first? It not that hard! "
But my kids learning computer applications fast more than mine.

.

[chemdata]

Seethrou thanks for the advice. I know what you mean about the kids as I always marvel that they seem to start any building project without looking at the instructions whereas I won't start until I've read the instructions.

I tried your suggestion and it did in fact remove the black line below the logo image. However, it dropped it to the center area below the category menu and it looks like its the same width as the logo image (136px). I tried all different combinations of the -14px with no success.

[seethrou]

How about give some gap to the bottom.

/* For IE6 or IE only */
* html #navCatTabsWrapper {
margin-top: -14px; /* please note it is negative value */
margin-bottom: 1px; /* make a gap here */
}

[chemdata]

seethrou, same results it dropped it to the center area below the category menu and it looks like its the same width as the logo image (136px). I may just have tolive with it the way it is or change the logo so that it does n't conflict with black line below it. Thanks.

[seethrou]

Since you had changed codes before and some modificationss we may not discussed. For example, you still had the tagline text in the page source although you had it dsiplay none in the css.
My suggested above were only quick and dirty fixes for the existing problem.

Would you mind attach, or send by PM to me if you perfer, the modified file to here of yours:
includes/templates/YOUR_TEMPLATE/common/tpl_header.php

May be we can find some solutions.

[chemdata]

Seethrou I believe I have it now. I went back to my stylesheet.css and:

commented out:
/*
#logoWrapper {
BACKGROUND-IMAGE: url(../images/logo666.gif);
BACKGROUND-REPEAT: repeat-x;
HEIGHT: 100%; BACKGROUND-COLOR: #000000;
} */

I also removed:
/* For IE6 or IE only */
* html #navCatTabsWrapper {
margin-top: -14px; /* please note it is negative value */
margin-bottom: 1px; /* make a gap here */
}

I then went back to my tpl_header.php file and made sure I had :
<br class="clearBoth" /> present in it.

I want to thank everyone for their help and in particular Seethrou.