Assigning custom background to multiple pages

Hi folks,

I refer to this page.

I’ve used the following code to assign a custom background to the page (a ‘parent page’), and want to have the same background appear on the child pages:

body.page-id-318 {
background: url(“http://ppredesign.perthpunk.com/wp-content/uploads/2013/06/Personal-Perspectives-backg.jpg”) !important;
}

Do I need to repeat the same code as above with each of the child page’s id numbers, or can I somehow add those id numbers to the code quoted?

Cheers

As long as you put that class on the body of the child pages your good.

Sorry, PicnicTutorials - not with you. Which class do you mean, and how would I put it on my child pages, please?

I know I can get that custom background on each of the child pages just by repeating the code with the ID of each child page:
For example, the background can be applied to the first child page (‘Ray De Motte’) as follows:

body.page-id-318 {
background: url(“http://ppredesign.perthpunk.com/wp-content/uploads/2013/06/Personal-Perspectives-backg.jpg”) !important;
}

Repeating the code like this seems long-winded, and is probably a reflection of my ignorance of a better option. I guess I’m just asking if there is a quicker, more concise way to have this custom background applied to all the child pages under the ‘Personal Perspectives’ parent. Been messing around, but haven’t found a way yet.

Cheers

Could you explain what you mean by ‘parent’ and ‘child’ pages? It doesn’t mean anything specific in terms of CSS. Do you mean that you want each page in the /personal-perspectives/ section to have the same background?

Sorry Ralph - wasn’t aware that parent/child page terminology was Wordpress-speak and not generally used. Yes, your interpretation is correct: I want each page in the /personal-perspectives/ section to have the same black-and-white collage background (ie: as the ‘Personal Perspectives’ page that appears on the nav menu).

Cheers

He’s talking about wp themes.

Do I need to repeat the same code as above with each of the child page’s id numbers, or can I somehow add those id numbers to the code quoted?

in one way or another you will need to add the class to the pages you want to have the bg.

there are two strategies you can follow.

  1. edit the heather page in the theme ( if you have access to it) and use a general class. something like :

$custom= array (139,139,150)// the page IDs you want to have the bg
$page_object = get_queried_object();
$page_id     = get_queried_object_id();
<body  class="<? if (in_array ($page_id , $custom)) {echo  "customClass";} ?>">
 .customClass{ your rules here...}

However since you already know you theme is adding the .page-id-xxx to your body tag you could just edit the CSS

body.page-id-318,body.page-id-319,body.page-id-320,body.page-id-321{ your rules...; }

either one will work.

hope that helps

Thanks a lot, dresden_phoenix. Your CSS code example is exactly what I was after.

Cheers!