CODEWITHSUNDEEP
phpcssmoduleblogssilverstripe
Ryan Achten
Ryan Achten

Reputation: 525

Best approach for styling SilverStripe's Blog module

I am trying to add CSS requirements to the Blog module.

The current approach I have adopted is creating a subclass of the Blog class and Blog_Controller (as well as the BlogPost and BlogPost_Controller) in an attempt to introduce css requirements into the init() function. However, for some reason, I can’t seem to get any reference to these css files to work.

  class ProjectsHolder extends Blog{

    private static $allowed_children = array(
       'ProjectPage'
     );
  }

  class ProjectsHolder_Controller extends Blog_Controller{

    public function init(){
      parent::init();
      Requirements::css("{$this->ThemeDir()}/css/projects.css");
    }
  }

I have also tried the <% require css %> template syntax. The only way I can get the css to render is by hardcoding the css link tag inside a head tag at the top of the template (which is terrible).

I also noticed SilverStripe’s DataExtension/SiteConfig approach for injecting functionality into classes, which looks like it might be applicable to my situation.

My question is: what is the best practice for styling modules such as the Blog module.

There is clearly something I am missing or not understanding here; any clarification would be much appreciated!

Upvotes: 0

Views: 126

Answers (1)

Terry Apodaca
Terry Apodaca

Reputation: 51

At first glance, if you are using a Themed CSS, then you can simply use

Requirements::themedCSS("projects");

In your code though, maybe the brackets are causing the issue: {$this->ThemeDir()} ?

The SilverStripe Docs give examples of doing this in both the template and the php files. It has recently been brought to my attention, though, that the 'preferred' way these days is to still use the 'requirements' but in the template like you mentioned.

<% require themedCSS("projects") %>

As for just styling your Blog module, and not having to extend anything or modify any of it's core code, why aren't you just adding the styles to your main style sheet or to it's own file/css and just include them in the main theme template?

What I do, is create a file called blog.css and just include it in my themes/themename/templates/Page.ss file using the above <% require %> for templates. Surely your css files don't have that large of a footprint that you need to take advantage of the Combining Files.

Upvotes: 1

Related Questions