Tell me more ×
WordPress Answers is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.
up vote 0 down vote favorite
1

The code below allow me to use a different CSS style to any page I declare

<body<?php if ( is_page(array('page1', 'page2', 'page3'))) {
echo ' class="myclass" '; } ?>>

for example I can use this css to page1 , page2 and page3:

.myclass #content { background-color: #123456; }
.myclass #content p { color: #987654; }

However I don't know how to use this with every page in one certain path e.g. path /products . Let's say I have have about 30 pages under the path: mysite.com/products/somepage1 --> somepage2, somepage3, ... somepage30

So I have to include every page in the code above and even worst, any time I add a new page I have to include it to the code.

Any chance to have a simple way to add all the pages(and new pages) in one certain path?

share|improve this question

2 Answers

up vote 2 down vote

Assuming that you're using parent page "photos" as a path.

It's good practice (and required by WordPress Theme Guidelines) to use body_class() function for output different classes, based on current page or post. Just insert this function in your theme.

<body <?php body_class(); ?>>

This function will add parent-pageid-(id) class on every child page, cause every child page of "photos" will share same parent-pageid-(id) class you can easily add specific styling to them.

.parent-pageid-(id-of-photos-page) #content {
     /** Put your style here */
}
.parent-pageid-(id-of-photos-page) #content p {
    /** Style for paragraph tag */
}
share|improve this answer
I use wp-ecommerce and I would like to use an different css style in every page under mysite.com/products-page to change a few background images of my theme – David Cibin Feb 6 '12 at 13:43
Didn't use WP e-Commerce, so not sure how it creates products page. Add body_class() template tag to <body> and then using Chrome dev tools or firebug inspect what classes are added for those specific pages. – Mamaduka Feb 6 '12 at 13:51
not sure if I did it right, but I got this: class="page page-id-79 page-parent page-template-default logged-in admin-bar wpsc" – David Cibin Feb 6 '12 at 14:02
Yes you did it right, but this is css classes for parent page, to target this page you can use this class e.g. - .page-id-79 #content and all its children pages would share same .parent-pageid-79 class – Mamaduka Feb 6 '12 at 14:06
Unfortunally it didn't work, I tried to change a background image but no lucky: .page-id-79 #page-top { background-image: url("img/page_top2.jpg") no-repeat; } – David Cibin Feb 6 '12 at 14:16
show 7 more comments
up vote 0 down vote

There's a wealth of options to choose from, actually, so there's bound to be a function that fits your needs.

We would need more detail about how you're generating pages you mention, but assuming you're talking about custom post types, adding this instead of is_page will have the desired effect in all pages, including future ones:

is_singular('wpsc-product');

If this isn't quite what you're looking for, check out the list of available functions here.

share|improve this answer
This is_singular didn't work, so this is not an example is exactly what I'm trying to do: I use wp-ecommerce and I would like to use an different css style in every page under mysite.com/products-page to change a few background images of my theme – David Cibin Feb 6 '12 at 13:37
I've edited the answer based on the changes you've made to the question, and the fact that you're using WP e-Commerce. – tbuteler Feb 6 '12 at 14:13
just to check,I tried this but didn't work: <body<?php if ( is_singular('wpsc-products')) { echo ' class="myclass" '; } ?>> – David Cibin Feb 6 '12 at 14:35

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.