Cold Steel Template Support Thread

[Alex H.]

I'm having a problem when viewing my store in Firefox 3.6.3 using Mac OS 10.6.3. It looks like the CSS is the problem, but I don't have a clear idea on how to fix it. I'm proficient at editing CSS to modify themes, but I was never good at cross-browser compatibility.

It looks just fine in Firefox using Windows XP, as well as in Safari on my friend's Mac. I was alerted to this problem by a customer this morning.

I'm using ZenCart 1.3.9b.

http://store.alexheberling.com

Here is a screencap, as well: http://alexheberling.com/media/ff_store.png

[clydejones]

I'm having a problem when viewing my store in Firefox 3.6.3 using Mac OS 10.6.3. It looks like the CSS is the problem, but I don't have a clear idea on how to fix it. I'm proficient at editing CSS to modify themes, but I was never good at cross-browser compatibility.

It looks just fine in Firefox using Windows XP, as well as in Safari on my friend's Mac. I was alerted to this problem by a customer this morning.

I'm using ZenCart 1.3.9b.

http://store.alexheberling.com

Here is a screencap, as well: http://alexheberling.com/media/ff_store.png

Unfortunately I don't have access to a Mac, so I'm afraid I can't provide a solution.

The template has been tested in FF, Safari, Opera and Chrome on my windows 7 machine.

[Mark Xapno]

Hello. First, my gratitude and respect to the Zen community: An impressive accomplishment in both technology and social interaction!

I'm in the initial stages of setting up my first Zen Cart store. I've successfully installed several templates so far, and have created a custom template from scratch, but I've decided to work with the Cold Steel template because I like the clean, spacious look.

My problem is that my new installation of the Cold Steel template doesn't match the demo as it appears on (sorry, site offline); There are brown tabs surrounding the 'Home, Login/Register' links, and there is a horizontal white space dividing the header.

Using Firefox/Web Developer Tool, I discovered several differences in the CSS between my site and the demo site. Curious, I downloaded the stylesheet.css from the demo site, and discovered it is not the same file that came in the Cold Steel download. The comments identify it as the'Christi Template CSS Stylesheet', as opposed to the 'Cold Steel Template CSS Stylesheet'.

I hope I haven't violated ettiquette by retrieving this file, but when I apply it to my site, it it does correct the display errors.

My questions are
1)What have I done wrong in my installation to cause this problem?
2)Is is permissible to simpy use the Christi Template CSS Stylesheet? I'm afraid that this stylesheet may have been written to work within the demo site and will introduce errors when used with the rest of the standard download files. Also, It seems a little rude to do so without asking.

My site: http://backyardperfect.com
Linux/Apache/GoDaddy
Zen Cart v1.3.9b
PHP 5.2.8
MySQL 1.3.9b
Cold Steel Template v2-0 (No changes to any Cold Steel files yet.)
No other mods

Thanks for helping to sort this out, and for all the work you've already done.

[clydejones]

Hello. First, my gratitude and respect to the Zen community: An impressive accomplishment in both technology and social interaction!

I'm in the initial stages of setting up my first Zen Cart store. I've successfully installed several templates so far, and have created a custom template from scratch, but I've decided to work with the Cold Steel template because I like the clean, spacious look.

My problem is that my new installation of the Cold Steel template doesn't match the demo as it appears on (sorry, site offline); There are brown tabs surrounding the 'Home, Login/Register' links, and there is a horizontal white space dividing the header.

Using Firefox/Web Developer Tool, I discovered several differences in the CSS between my site and the demo site. Curious, I downloaded the stylesheet.css from the demo site, and discovered it is not the same file that came in the Cold Steel download. The comments identify it as the'Christi Template CSS Stylesheet', as opposed to the 'Cold Steel Template CSS Stylesheet'.

I hope I haven't violated ettiquette by retrieving this file, but when I apply it to my site, it it does correct the display errors.

My questions are
1)What have I done wrong in my installation to cause this problem?
2)Is is permissible to simpy use the Christi Template CSS Stylesheet? I'm afraid that this stylesheet may have been written to work within the demo site and will introduce errors when used with the rest of the standard download files. Also, It seems a little rude to do so without asking.

My site: http://backyardperfect.com
Linux/Apache/GoDaddy
Zen Cart v1.3.9b
PHP 5.2.8
MySQL 1.3.9b
Cold Steel Template v2-0 (No changes to any Cold Steel files yet.)
No other mods

Thanks for helping to sort this out, and for all the work you've already done.

first: to fix the gap in the header, open includes/templates/cold_steel/css/stylesheet.css

find the following declaration and add the highlighted portion:

#headerWrapper {
margin: 0 auto;
background:#EEEEEE;
text-align: left;
width: 917px;
vertical-align: top;
}

Second: if you prefer not to have the tabbed menu you can delete the reference(s) to the images in the stylesheet.

open includes/templates/cold_steel/css/stylesheet.css

find the following declarations and delete the highlighted portions:

#navMain a {
margin:0;
padding:0 5px 0 4px;
float:left;
background: url(../images/tableft.gif) no-repeat left top;
color:#854401;
text-decoration:none;
}
#navMain a span {
padding:2px 15px 2px 5px;
float:left;
display:block;
background: url(../images/tabright.gif) no-repeat right top;
color:#854401;
}
#navMain a:hover {
background-position:0% -42px;
}
#navMain a:hover span {
background-position:100% -42px;
color:#fff;
}

#navMain .current a {
background-position:0% -42px;
}
#navMain .current a span {
background-position:100% -42px;
color:#fff;
}

[Mark Xapno]

Thank you for such quick response!
I quickly tried your suggestions, but they don't seem to be the answer. The results are currently visible on my site.
Part of the white gap issue is that the header in the demo is 110px or so in height, whereas my site has a header height of 140px- it seems as though the date is adding to the header space rather than fitting within it.
The tabs issue looks like it will require some additional css tinkering to get the colors to agree- I think I'll be up to that task.
Should I forget about utilizing the Christi Template completly? On the surface, it seems to take care of everything..
I appreciate your efforts.

A quick note: Please don't rush; I suddenly need to be elswhere, but will be back later. Thanks again.

[clydejones]

Thank you for such quick response!
I quickly tried your suggestions, but they don't seem to be the answer. The results are currently visible on my site.
Part of the white gap issue is that the header in the demo is 110px or so in height, whereas my site has a header height of 140px- it seems as though the date is adding to the header space rather than fitting within it.
The tabs issue looks like it will require some additional css tinkering to get the colors to agree- I think I'll be up to that task.
Should I forget about utilizing the Christi Template completly? On the surface, it seems to take care of everything..
I appreciate your efforts.

A quick note: Please don't rush; I suddenly need to be elswhere, but will be back later. Thanks again.

Or you can download v1.0 of cold_steel.

go to the downloads section find cold steel and scroll to the bottom of the page and download v1.0.

[clydejones]

Or you can download v1.0 of cold_steel.

go to the downloads section find cold steel and scroll to the bottom of the page and download v1.0.

You can also replace the entire section between

/*BOF Header layout*/
AND
/*EOF top main navigation*/

with the following:

	/*BOF Header layout*/	
#headerWrapper {
margin: 0 auto;
	background: url(../images/header_bg.gif) no-repeat;
	text-align: left;
	width: 917px;
	vertical-align: top;
	}
	/*BOF Branding*/	
#logoWrapper{
   margin:0;
	background: none;
	height:90px;
	width:917px;
	position: relative;
	top:0;
	left:0;
	}
#logo {
float:left;
/*	display:none;
text-align: center;*/
	}
#logoWrapper a:hover {
background: transparent;	
}
#navMainSearch {
position:absolute;
top: 5px;
right: 15px;
}

#taglineWrapper {
	text-align: center;
	height: 30px;
	width: 300px;
	position: absolute;
	top: 5px;
	left: 250px;
}
#tagline {
	font-size: 1.2em;
	font-weight: bold;
	text-align: center;
	vertical-align: middle;
	}
.date {
   padding-left:5px;
	position: absolute;
	top: 75px;
	right: 20px;
	color:#000;
	font-weight: bold;
	text-align: left;
	font-size: 1.2em;
	line-height:normal;
}	
	/*EOF Branding*/
	
/*BOF navigation*/		
	/*BOF top main navigation*/		
#navMainWrapper {
background:url(../images/navmain_tab.gif) no-repeat;
	font-size: 1.1em;
	height:30px;
	line-height: normal;
	width: 917px;
	}

#navMain {
      float:left;
      width:100%;
	font-size: 1.1em;
      }
#navMain ul {
          margin:0.6em 0 0;
          padding: 5px 10px 0 15px;
          list-style:none;
      }
#navMain li {
      display:inline;
      margin:0;
      padding:0;
      }
#navMain a {
      margin:0;
      padding:0 5px 0 4px;
      float:left;
/*   background: url(../images/tableft.gif) no-repeat left top;*/
   color:#854401;
      text-decoration:none;
      }
#navMain a span {
   padding:2px 15px 2px 5px;
      float:left;
      display:block;
/*   background: url(../images/tabright.gif) no-repeat right top;*/
   color:#854401;
      }
#navMain a:hover {
/*      background-position:0% -42px;*/
      }
#navMain a:hover span {
*/      background-position:100% -42px;*/
		color:#fff;
      }

#navMain .current a {
/*      background-position:0% -42px;*/
      }
#navMain .current a span {
/*      background-position:100% -42px;*/
		color:#fff;
      }
			/*#navMain ul li.contact a {
   margin:0;
   padding: 0 5px 0 4px;
   float:left;
   color: #fff;
   background: url(../images/tableft.gif) no-repeat left top;
   text-decoration:none;
	}
#navMain ul li.contact a span {
   display:block;
   background: url(../images/tabright.gif) right top;
   padding:2px 15px 2px 6px;
   }
#navMain ul li.contact a:hover {
   background-position:0% -42px;
   }
#navMain ul li.contact a:hover span {
   padding:2px 15px 2px 6px;
   background-position:100% -42px;
   }	
#navMain ul li.account a {
   margin:0;
   padding: 0 5px 0 4px;
   float:left;
   color: #fff;
   background: url(../images/tableft.gif) no-repeat left top;
   text-decoration:none;
	}
#navMain ul li.account a span {
   display:block;
   background: url(../images/tabright.gif) no-repeat right top;
   padding:2px 15px 2px 6px;
   }
#navMain ul li.account a:hover {
   background-position:0% -42px;
   }
#navMain ul li.account a:hover span {
   padding:2px 15px 2px 6px;
   background-position:100% -42px;
   }	*/
/*#navMain ul li.cart a {
   margin:0;
   padding: 0 5px 0 4px;
   float:left;
   background: url(../images/tableft.gif) no-repeat left top;
   color:#FFF;
   text-decoration:none;
	}
#navMain ul li.cart a span {
   display:block;
   background: url(../images/tabright.gif) right top;
   padding:2px 15px 2px 6px;
   color:#FFF;
   }
#navMain ul li.cart a:hover {
   background-position:0% -42px;
   }
#navMain ul li.cart a:hover span {
   padding:2px 15px 2px 6px;
   background-position:100% -42px;
   }
#navMain ul li.cart .current a {
   background-position:0% -42px;
   }
#navMain ul li.cart .current a span {
   padding:2px 15px 2px 6px;
   background-position:100% -42px;
   }*/
		/*EOF top main navigation*/

[Mark Xapno]

Success!
I substituted the code as suggested and all is well.
I thank you very much.
Mark

[aggrable]

I've looked through this thread and I haven't found the answer to my question: I'm using v1.3.9b at www.mysportsmouse.com/zencart and I would like to integrate your template in via iframe so I can keep the original style while still utilizing the Zen Cart interface.

The problem is that when I go into the "new_install" folder, there are three folders (languages, modules and templates) which I upload to their respective places in the admin/includes/templates folder.

I then go to the admin section, click on "tools" and then on "template selection" and the option for "cold steel" is not in the drop-down. What am I doing wrong? Did I put them in the wrong folder?

[clydejones]

I've looked through this thread and I haven't found the answer to my question: I'm using v1.3.9b at www.mysportsmouse.com/zencart and I would like to integrate your template in via iframe so I can keep the original style while still utilizing the Zen Cart interface.

The problem is that when I go into the "new_install" folder, there are three folders (languages, modules and templates) which I upload to their respective places in the admin/includes/templates folder.

I then go to the admin section, click on "tools" and then on "template selection" and the option for "cold steel" is not in the drop-down. What am I doing wrong? Did I put them in the wrong folder?

You should upload the entire includes folder to the where you have zen cart installed on your server.

IT DOES NOT GO in admin/includes

You might also want to note that Zen Cart does not work well using iframes. (do a forum search for iframes)