[SOLVED] Problems with page background

molligirl · #1 Mar 9, 2010, 02:25 PM

First of all, I LOVE and appreciate this theme and the gurus behind it. Being a designer, not a programmer, I'm working really hard to learn how to use it as well as I can.

I'm a bit confused about how to style my homepage differently than the interior pages. I want my homepage to have a different background, different content area and styles, etc.

Here's the url I'm working on: http://visionofwholeness.org

And here's the code I tried entering into the CSS Inserts area:
body#page-id-66 div.bodyrow{
background: url(/wp-content/themes/atahualpa/images/bgHomePhoto);
}

I can't figure out what I'm doing wrong, and would appreciate help.
Thanks much!

juggledad · #2 Mar 9, 2010, 04:23 PM

try this, you want the background for the body, not the bodyrow

HTML Code:

body#page-id-66 {
background: url(/wp-content/themes/atahualpa/images/bgHomePhoto); 
}

molligirl · #3 Mar 9, 2010, 06:10 PM

Thanks - I tried that and the following code, but it still doesn't work. I'm putting it in the CSS Inserts. Can't figure it out.

body#page-id-66 div#container {
background: url(http://visionofwholeness.org/wp-cont...HomePhoto.pg);
}

paulae · #4 Mar 9, 2010, 06:13 PM

You mean .jpg, not .pg.

molligirl · #5 Mar 9, 2010, 07:38 PM

Yes, I caught that, but still not working.

juggledad · #6 Mar 10, 2010, 05:47 AM

You have a problem with the names and or locations of your images. The name of the image must match EXACTLY the name in the folder and CASE IS IMPORTANT - an 'A' does not equal an 'a'

molligirl · #7 Mar 10, 2010, 03:12 PM

Thank you -
I fixed the naming, and also tried the approach of creating a custom page template for my homepage (named "homepage.php) and a bunch of css styles in the CSS Inserts. I still can't get rid of that background graphic.

http://www.visionofwholeness.org

Among all the other css, the code I inserted for a custom background is:

body#page-id-66 {
background: url(/wp-content/themes/atahualpa/images/bgHomePhoto.jpg);
}

juggledad · #8 Mar 10, 2010, 03:49 PM

In a CSS selector, a class is identified with a '.' while an ID is identified with a '#'. Since the 'page-id-66' is a class (<body class="home page page-id-66 page-template page-template-homepage-php">) the CSS Selector needs to be 'body.page-id-66' not 'body#page-id-66' so you should have

HTML Code:

body.page-id-66 {
background: url(/wp-content/themes/atahualpa/images/bgHomePhoto); 
}

molligirl · #9 Mar 12, 2010, 11:53 PM

Thank you! On to the next issue - for another thread.