help with backs [#155083]

Hi to all.

This is a newbie question, but I started a new projec with zen cause is a blank theme and I can customize it. The question is, I want to give background colours and imagens to the left and right bars and to content area. What is the better way to do it?

Many tks to all and sorry my bad english

Comments

Comment #1

dtabach commented 28 June 2007 at 16:36

Answer from a newbie:

I used the Zen with different backgrounds in this site: http://prolimoveis.com.br

Added the background for the top navigation (logo + primary links) by adding a #bgheader ID:

#bgheader
background-image:url(bgheader.jpg);
background-position:right top;
background-repeat:no-repeat;
height:145px;
margin:0px;
width:800px;
}

Please notice that I had to create a new <div id="bgheader">...</div> tag in page.tpl.php, which is open just after <div id="header"> and is closed just after <?php if ($primary_links): ?>....<?php endif; ?>.

For the grey left sidebar, I added the background in the #page ID:

#page
background-image:url(bgpage.jpg);
background-repeat:repeat-y;
color:#111111;
font-family:Verdana,Arial,Helvetica,sans-serif;
line-height:1.5em;
}

My bgpage.jpg is 800px wide, in which the left portion is grey, and the rest (corresponding to the main content area) is white.

Last, added a background for the whole page in the body class:

body
background-attachment:fixed;
background-color:#999999;
background-image:url(bgbody.jpg);
background-repeat:repeat-x;
}

I also replaced images/tags.gif by a new one, to give a new look to the primary links tabs. You just have to keep the same size of the original image, and its division in 3 'rows', each one will correspond to different status: normal, hover, active.

Hope this helps.