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

Applying CSS to Silverstripe - No Way!


6 Posts   1343 Views


7 May 2009 at 9:54pm Community Member, 108 Posts

Is there a way to apply a projects css theme/style to SS so that when we are looking at the page data it renders the same as what the users will see on the website.

For example, on this project we render bullets very specifically with a certain bullet. In the CMS, it doesn't show the bullet until you look at the page in a browser.

Or, if I set a piece of text to an H4, for example, it doesn't apply the CSS that I've set for the project.

I'm sure it's simple, but just wanted to see if it's possible.




7 May 2009 at 11:49pm Community Member, 901 Posts

The styles in typography.css are loaded in the WYSIWYG editor.
Actually, it's editor.css, but as you can see there, typography.css is being included with an @import statement


10 May 2009 at 11:17am Community Member, 108 Posts


Thanks for the reply. Actually where do you see that it's editor.css and the @import?

Is this in the cms/css directory or are you look at a php file?



10 May 2009 at 6:52pm (Last edited: 10 May 2009 6:54pm), Community Member, 901 Posts

Hi Terry

As far as I know, the editor.css file is included by the CMS (CMSMain.php), and it's used to load styles for the WISYWYG Editor. Usually, editor.css can be found in mysite/css or the themes/yourtheme/css directory.
The @import statement is a CSS directive to load other css files. This statement is part of the CSS standard. Here's an article that describes it:

So to summarize:
1) CMS includes editor.css,
2) editor.css uses @import statement to import the typography.css styles

At least that's the common behavior. Of course you can edit the editor.css and import other stylesheets too.


11 May 2009 at 1:27am Community Member, 127 Posts

Terry, you might want to have a look at Firefox and the Firefox plugin Firebug. It will show you which CSS rules are applied and where they come from, with the file names of the CSS files.


11 May 2009 at 1:42am Community Member, 108 Posts


Thank you 100 times. It was way to simple. I figured it was. I was able to simply add an @import for the css that I was using for the live site and it took.

Thank again.

Also Kalileo, yes, willr turned me on to this plugin. What a great plugin and a must have. It really help troubleshoot problems.

Thank you for your response.

I'm about to launch this new site, my first one. The client is exceedingly happy. Exceedingly!

I couldn't have done it without the help of this forum.