Should I make a new Theme, or just a new Page Type?
Permalink
I'm gathering my materials to start building out a new website. The client has 4 different areas that their business focuses on. Each one represented by a color change in their logo. The design has the same layout everywhere, but each section (and all pages underneath it) will have a color scheme matching the version of the logo for that section.
A separate Theme for each of these seems most obvious...but then I have the issue of managing CSS across several themes. If the only things changing are a few background images and color styles, it seems overkill to move the entire style sheet for the layout from theme to theme and then have to change it every time I edit something.
Thoughts on this?
A separate Theme for each of these seems most obvious...but then I have the issue of managing CSS across several themes. If the only things changing are a few background images and color styles, it seems overkill to move the entire style sheet for the layout from theme to theme and then have to change it every time I edit something.
Thoughts on this?
I've never done this but maybe you can do separate Page types for each section and have the logo called in your page types instead of the header.php, you don't need to create separate stylesheets, all the style rules for all these page types can go into the main.css
This should pretty much be doable completely in CSS by naming or classing the body element.
For instance, if you have a section called 'about' and a section called 'profile', you could give the body a class name with those sections' (parent) page handle like
and namespace your CSS like
For the logo, I usually use an h1 with height and width with a background image and then add a span with the site name, absolutely positioned with negative offset (top:-1000;left:-10000).
Managing separate themes and page types, to me, seems cumbersome.
Hope this helps.
For instance, if you have a section called 'about' and a section called 'profile', you could give the body a class name with those sections' (parent) page handle like
<body class="page-about">
and namespace your CSS like
.page-about some_element {border-color:'#c00';}
For the logo, I usually use an h1 with height and width with a background image and then add a span with the site name, absolutely positioned with negative offset (top:-1000;left:-10000).
Managing separate themes and page types, to me, seems cumbersome.
Hope this helps.
Building separate themes is complete overkill and will cause more problems than it solves for you in this case. Building separate page types is a better solution, but still not ideal if everything else on the pages is the same (and because then the user needs to make sure to choose the right page type every time they add a new page depending on which section they are in).
The way I'd do this (and this is specific to your situation where the rest of the page is the same throughout and the deciding factor on the color is which section of the site they're in) is put an "IF" statement into your template code that checks for which section of the site the page is in, and puts in a different CSS class depending on that. (I'm assuming all of the needed color changes can be handled in CSS, i.e. not requiring different images or different html markup).
So... you could do something like this before your <body> tag:
The View::section() function checks to see if the current page is anywhere underneath the top-level page you ask about (for example, View::section('news') would return TRUE if you're viewing the news page or news/article1 or news/january/article1 -- any page underneath the top-level page of your site that has "news" as its path).
You will need to alter the section names and the class names to suit your own purposes of course.
In your css then you can set the proper styles for each section:
etc. etc.
Hope that makes sense!
-Jordan
The way I'd do this (and this is specific to your situation where the rest of the page is the same throughout and the deciding factor on the color is which section of the site they're in) is put an "IF" statement into your template code that checks for which section of the site the page is in, and puts in a different CSS class depending on that. (I'm assuming all of the needed color changes can be handled in CSS, i.e. not requiring different images or different html markup).
So... you could do something like this before your <body> tag:
<?php $bodyClass = ''; if (View::section('about')) { $bodyClass = 'scheme1'; } else if (View::section('news')) { $bodyClass = 'scheme2'; } else if (View::section('people')) { $bodyClass = 'scheme3'; } else if (View::section('contact')) { $bodyClass = 'scheme4'; } ?> <body class="<?php echo $bodyClass; ?>">
The View::section() function checks to see if the current page is anywhere underneath the top-level page you ask about (for example, View::section('news') would return TRUE if you're viewing the news page or news/article1 or news/january/article1 -- any page underneath the top-level page of your site that has "news" as its path).
You will need to alter the section names and the class names to suit your own purposes of course.
In your css then you can set the proper styles for each section:
.logo { background-color: #fff; } .section1 .logo { background-color: #ccc; } .section2 .logo { background-color: #999; }
etc. etc.
Hope that makes sense!
-Jordan
Jordan, that's pretty much exactly what I was looking for. THANK YOU!
I knew that a separate Theme for each section seemed like overkill, but expecting our client to click on the correct page type when adding new pages didn't seem like it would be very intuitive either. Well, I mean, it's intuitive for me...but not necessarily a non-tech savvy client ;-)
Thank you!
I knew that a separate Theme for each section seemed like overkill, but expecting our client to click on the correct page type when adding new pages didn't seem like it would be very intuitive either. Well, I mean, it's intuitive for me...but not necessarily a non-tech savvy client ;-)
Thank you!
Anyone have any thoughts on this? I'm asking mainly out of curiosity...not on how to actually do it.