Well, i love the eclipse template and it's perfect for what I'm doing, but...I need to change the word "eclipse" at the top to something else. Without buying a $400 copy of photoshop how can i do this? I was kinda disappointed that you didn't include a logo template w/o text on it.

Hi draco1938,

The header constructed from several images to accomodate the flexibility in page width. So, I split the master image up to 5 chunks of images:
- background
- left side
- right side
- bottom
- logo

The construction it self took place in custom.css (u can edit it with any of your favourite text editor):

for background in line-10. The assignment would be similar to this:
#top_wrapper{
background:transparent url(../images/headerbg.jpg) repeat-x scroll 0% 50%;
height:110px;
width:950px;
}

for the left side in line-16, similar to this:
#header_left {
background:transparent url(../images/headerleft.jpg) no-repeat scroll left center;
}

as for the right side line-20, which is:
#header_right {
background:transparent url(../images/headerright.jpg) no-repeat scroll right center;
}

and for the bottom line-28:
#header_nav {
background:transparent url(../images/topnav_bg.jpg) no-repeat scroll 0% 50%;
float:left;
height:22px;
}

the last is logo at line-34:
#logo {
background:transparent url(../images/logo.jpg) no-repeat scroll left bottom;
height:110px;
}

so if you want to remove the logo, just delete the background's line in #logo declaration, so it becomes:
#logo {
height:110px;
}

try hacking around on deleting the backgrounds to see different results.

If you need the master image of the header, u can download the attachment file I provided below. There are two files inside it: the clean one and the header with navigation back-shade-image.

So, if your page width (the header width) is fixed and you want to use only one single image, you can remove all backgrounds declaration in five place I've describe above but one #top_wrapper. Change the filename(logo.jpg) with your image filename. Alternatively you can override the logo.jpg with your image.

Hope this can help..

Ty very much for the help thus far. Here is how I changed the custom.css file.

Code:

.bodies{ background: #000000; margin-top: 15px; line-height: 150%; font-family: verdana, arial, tahoma, sans serif; font-size: 11px; font-weight:normal; color:#dadada; } #top_wrapper { height: 110px; width: 950px; background: url(../images/headerbg.jpg) repeat-x; } //#header_left{ // background: url(../images/headerleft.jpg) left no-repeat; //} // //#header_right{ // background: url(../images/headerright.jpg) right no-repeat; //} // //#header_top { // height: 88px; //} // //#header_nav { // height: 22px; // background: url(../images/topnav_bg.jpg) no-repeat; // float: left; //} #logo { height: 110px; background: url(../images/logo.jpg) bottom left no-repeat; }

And then I made a custom version of logo.jpg and put it in the images folder. Everything works fine, except my menu moved to the top right of the page instead of just below the logo...any suggestions?

Would you like to share your live site url with us? We need to see more clearly about your problem

The menu contained in the header. You may have noticed that the header has 110px in height and the menu has 22px in height. So for the menu to be able to positioned it self at the bottom of the header, it needs 88px offset from the top. That's exactly the height of the #header_top.

Since you have removed #header_top in the css file, the menu would definetely move to the top of the header.

I'm suggesting that you leave the height property of the #header_top and remove only it's background.

regards,