I have just started working with ruby on rails properly like for a week and now I have started working on RefineryCMS, I followed the official guide and created a demo application and got to know the interface and the CMS itself a little bit, now I am trying to create a proper site using RefineryCMS. The first thing I wanted to do was to change the appearance of the default homepage, hence I override it and added my own HTML that I have and replaced the default layout that worked fine to some extent. Now the problem is I had style sheet associated with my HTML, as I am new to this CMS I cannot find a way to properly link my style sheets/ override my style sheets associated with the home page. I have followed the official documentation but was unable to get through the idea of how to override the stylesheets, I have followed other various links as well.
Can someone please guide me to a tutorial where there is a stepwise explanation regarding how to do that, or even better a stepwise detailed tutorial for newbies like me to get started with the RefineryCMS, I have spent hours but still have found a proper way, maybe I havent been looking or googling the right question because I am new to this CMS i.e. "How do I properly link my overridden HTML in refineryCMS to its corresponding stylesheets also to the corresponding images and javascript files"
I would really appreciate any sort of help to get me going. Thank you.
Thanks for using Refinery. There are two ways to do this, but really the first one is my preference.
The easy and recommended way, using CSS selectors:
First, check out the getting started guide's section on "styling views".
Now, just create an asset file for the home page, let's call it
app/assets/stylesheets/home.css.scss. To that, we can add nested styles under the following ID selector. I've addedbackground: red;so that you can see an immediate result:This is the way that I would recommend adding CSS for templates.
For the non-recommended, complicated way that requires extra assets and adding to the precompile list:
First, see the overriding views guide.
Now, with the refinery/pages/home.html.erb template that you will have, you can link to a stylesheet:
The stylesheet should now be linked in the
<head>section of the page and you should be able to add CSS that just relates to the home page by creating theapp/assets/stylesheets/home.css.scssfile and applying it in the same way as the first section:Note that because this is in the same directory as the manifest file
application.cssit will automatically get included for all templates, too, and so this is more complicated. It also requires you to add to the precompile list inconfig/application.rb: