Sunrise - A free responsive HTML5 theme for SilverStripe CMS

Posted by Matt Bailey on 14 February 2012

Sunrise SilverStripe Theme

 

SilverStripe Theme Contest Finalist BadgeWe were delighted to be voted third overall by the SilverStripe judges. Congratualtions to Sveta here at GPMD, who's 'Tangerine' theme was also voted 'Judges Choice' out of the non-finalists. And a big well done to Sara Tušar, who's theme 'Simple' came in first place. Click here for full details on all the finalists.

If any of you follow me on Twitter you’ll have noticed me going on recently about a theme contest for SilverStripe CMS. Here at GPMD we love SilverStripe and use it as the platform for many of our projects, so when we heard about the contest we thought we’d like to give something back.

View a live demo or get stuck in and download the theme below:

Live demo | Download Sunrise SilverStripe theme v1.0.0

Our Considerations

When discussing what we wanted to achieve there were a few considerations we felt were important. The theme should be:

  • Beautiful (naturally)
  • Exclusive - you won’t see this theme anywhere else, it’s exclusive to SilverStripe
  • Neutral - suitable for any kind of business, organisation or personal website
  • Compatible - works with SilverStripe version 2.4 and the soon to be released version 3
  • Current - uses HTML5 and CSS3 (degrades gracefully on older browsers)
  • Accessible - clean and semantic code
  • Non-dependent - uses minimal Javascript
  • Responsive - looks good no matter what device it’s being viewed on

We also took into account the fact that a default SilverStripe install doesn’t include any data or widgets, so it had to look good with little or no content.

Our Solution

I’ve worked with many different themes on various platforms and the ones I’ve enjoyed using the most are those that aren’t overly styled and are easy to customise - I’m a front-end developer and I don’t want the way a theme is set up to get in my way of being creative with it.

Therefore, my primary goal was to create a beautiful bare-bones theme that could be used as is, or built upon and expanded quickly by developers.

Rather than try and re-invent the wheel I used the superb HTML5 Boilerplate as my base template and the excellent 320andup HTML5 Boilerplate Extension to bring in the responsive ‘stuff’. 320andup works on the basis of 'mobile first', so it prevents mobile devices from downloading desktop assets by using a ‘mobile’ stylesheet as its starting point.

Then into the mix I integrated the default SilverStripe template features (three level menu, sidebar support, breadcrumbs etc.), added a touch of sexy css (using LESS) and bingo, one fully responsive, gorgeous SilverStripe theme!

As an added extra I included styling for the simple blog module because I know a lot of people will want to use that.

Just gimme the good stuff already!

If you’ve read this far I assume you’re still interested in downloading the theme. Simply click the big button below and off you go, take it and make it your own.

Live demo | Download Sunrise SilverStripe theme v1.0.0

Feedback and Support

This is just the start for Sunrise, so I’m sure issues will arise as people use it. Please feel free to leave your feedback in the comments section below and we’ll do our best to implement updates and fixes in future releases.

You can also submit support questions, although as it’s a free theme the time we’re able to dedicate to support will be limited. However, we are planning on producing more themes in the future and will therefore be setting up a dedicated support forum at some point, so watch this space...

The theme is free and covered by exactly the same BSD license as SilverStripe.

---

You can follow Matt on Twitter, Dribbble and Google Plus.

Comments (7)

  • Richard Johnson Richard Johnson on February 15th, 2012

    Excellent theme Matt. Nice work.

  • prodyot prodyot on February 22nd, 2012

    Great responsive template.
    I am also a believer in simplicity and this template has elegance about it.
    The demo worked fine.
    When I downloaded the theme and tried it out of the box it doesn't work out of the box.
    Did I miss something?
    Will I be required to install some other software/scripts?

  • Matt Matt on February 28th, 2012

    Hi prodyot. Thanks, I'm glad you like the theme.

    I don't know how familiar you are with SilverStripe but there are a couple of steps involved in installing and activating a theme. Rather than go into detail here, have a look at this page on the SilverStripe website: http://doc.silverstripe.org/sapphire/en/topics/themes

    Let me know if that helps or not?

  • Gene Gene on March 20th, 2012

    I was wondering if the packaged .less file was used to generate the .css file, or if the .less file is out of date.

  • Matt Matt on March 20th, 2012

    Hi Gene. The .less file is up-to-date so you can use that to generate your css file.

  • Mirko Mirko on March 24th, 2012

    Just wanted to thank you guys for this cool Theme! i was looking for exactly this kind of style!

  • JCG JCG on March 28th, 2012

    Very cool theme, it's outstandingly elegant and minimalistic... Thank you very much!

Post your comment