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.

General Questions /

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

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

CSS QUESTION


Reply


4 Posts   711 Views

Avatar
servalman

Community Member, 211 Posts

24 June 2010 at 5:51am

Hello

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

Thanks

Avatar
biapar

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 %>

Avatar
prawnstar

Community Member, 127 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.

Chris.b

Avatar
TotalNet

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 Page.ss 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

Rich