Jump to:

23001 Posts in 11702 Topics by 2827 members

General Questions

SilverStripe Forums » General Questions » Applying CSS to Silverstripe - No Way!

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

Page: 1
Go to End
Author Topic: 1247 Views
  • TerryMiddleton
    Avatar
    Community Member
    108 Posts

    Applying CSS to Silverstripe - No Way! Link to this post

    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.

    Thanks,

    Terry

  • banal
    Avatar
    Community Member
    901 Posts

    Re: Applying CSS to Silverstripe - No Way! Link to this post

    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

  • TerryMiddleton
    Avatar
    Community Member
    108 Posts

    Re: Applying CSS to Silverstripe - No Way! Link to this post

    banal,

    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?

    Terry

  • banal
    Avatar
    Community Member
    901 Posts

    Re: Applying CSS to Silverstripe - No Way! Link to this post

    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: http://www.cssnewbie.com/css-import-rule/

    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.

  • Kalileo
    Avatar
    Community Member
    127 Posts

    Re: Applying CSS to Silverstripe - No Way! Link to this post

    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.

  • TerryMiddleton
    Avatar
    Community Member
    108 Posts

    Re: Applying CSS to Silverstripe - No Way! Link to this post

    banal,

    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.

    Terry

    1247 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.