Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Header configuration & styling (http://forum.bytesforall.com/forumdisplay.php?f=15)
-   -   custom background (http://forum.bytesforall.com/showthread.php?t=6282)

moveright Mar 15, 2010 06:19 AM

custom background
 
I recently purchased a single license for Thesis and I must say, I'm let down. I have since discovered that support for that theme is near non-existent. So, I did some digging online and found Atahualpa and here I am. I have a simple task I need to complete and would like to see if I can get a response here. http://www.juliegracestudio.com is the site I am revamping (hopefully with atahualpa). looks like that background is drawn using (4) images and (3) divs. here is the code that makes it work currently.

"#page {
background: #e2ddd9 url('images/kbgwide.jpg') ;
border: 0;
text-align: left;
}
#wrapper {
padding: 0;
margin: 0;
background: url('images/wrapper.jpg') no-repeat center top;
width: 100%;
display: table;

}
#footer {
background: url('images/kfooter.jpg') no-repeat top;
border: none;

}
"

Is this going to be doable using atahualpa?

thanks so much for any help. I'd love to see that I can get support here.

juggledad Mar 15, 2010 07:48 AM

yes that is doable, several people have done it.
you will put the main image in the body style,
the footer image in the Footer section styling
the center image in the Center styling
you'll want to make it a fixed width page
you will have to do some fine tuning and may have to make some changes, but it is doable

moveright Mar 15, 2010 08:00 AM

so what would I do with the actual background image which is about 125x125px image called bg.jpg? I would have to lay that down first, then lay the wrapper image(top of the papers)?

so body would be bg.jpg and header would be the wrapper.jpg and so on and so forth? That's how the current theme does it, in header.php it calls for <div id=wrapper> which apparently is a container holding the top part of the note pages.

juggledad Mar 15, 2010 09:13 AM

what you would do is use the bg.jpg as the background then add a css insert for 'div#container' for the 'wrapper.jpg'.

you will have to adjust the widths and play with margins and padding but you should be able to do it.

moveright Mar 15, 2010 10:05 AM

Quote:

Originally Posted by juggledad (Post 27685)
what you would do is use the bg.jpg as the background then add a css insert for 'div#container' of the 'wrapper.jpg'.

you will have to adjust the widths and play with margins and padding but you should be able to do it.

first off thanks! second, where do I add that code above? I mean, the
#wrapper {
padding: 0;
margin: 0;
background: url('images/wrapper.jpg') no-repeat center top;
width: 100%;
display: table;

}

part of it?

juggledad Mar 15, 2010 11:36 AM

you put your additional CSS in the CSS Inserts area and don't use #wrapper, use #container as the selector, BUT first, you should spend a little time looking at all the pages in the theme to get an idea of what you can change where

moveright Mar 15, 2010 11:50 AM

Quote:

Originally Posted by juggledad (Post 27700)
you put your additional CSS in the CSS Inserts area and don't ues #wrapper, use #container as the selector, BUT first, you should spend a little time looking at all the pages in the theme to get an idea of what you can change where

I'm quite embarrassed :oto admit but I'd appreciate if you could dumb that down a bit more. Honestly, I actually understand CSS pretty well but this theme is so different from anything I've worked with, it's quite confusing.

juggledad Mar 18, 2010 05:23 AM

add this additional CSS to the 'ATO->Add HTML/CSS Inserts->CSS Insert' option. and code it with out the #wrapper so it will be something like
HTML Code:

#container {
padding: 0;
margin: 0;
background: url('images/wrapper.jpg') no-repeat center top;
width: 100%;
display: table;
}



All times are GMT -6. The time now is 02:49 AM.

Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.