Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

We're retiring the forums!

The SilverStripe forums have passed their heyday. They'll stick around, but will be read only. We'd encourage you to get involved in the community via the following channels instead:

General Questions /

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, Ed, biapar, Willr, Ingo, swaiba


Go to End

4 Posts   872 Views


Community Member, 211 Posts

24 June 2010 at 5:51am


My client wants his site to be for some page with an overall black backround and white types and other pages the opposite so my question is

how do you insert custom css files to override the layout and typography ?

I have read some solutions but it is still not clear, does someone have something that would work with 2.4 properly



Forum Moderator, 435 Posts

24 June 2010 at 7:15am

You can use section command in layout template.

<% if Section(Alfa) %>
<div id="a">..............</div>
<% else %>
<div id="b">..............</div>
<% end_if %>


Community Member, 130 Posts

24 June 2010 at 10:00am

I think the easiest way would be to create a second template and put something like this in the head of your new template file:

<% require css(themes/your-theme/css/your-style.css) %>

servalman's method would work too, but if you have a lot of template code between those div's, you may just want to create an additional template.



Community Member, 181 Posts

24 June 2010 at 11:22am

Edited: 24/06/2010 11:23am

The 'best' solution will depend largely on how your client will decide which pages are white-on-black and which are black-on-white.

Will it be alternating sub-pages in a parent page; parent pages in one, sub-pages the other; simply by ticking a box in the CMS for that page; or are they different page types (Page sub-classes)?

Personally, I would avoid creating additional templates and css files and go for setting the class of the main element (body or containing div) using a variable in the template e.g.

<div class = "typography {$BlackOrWhite}">

Then you decide the value of $BlackOrWhite in your Page class depending on the conditions above and style for class black/white accordingly in your layout.css