Expert advice on managing online communities — for customer service, peer-to-peer collaboration, ideation, and more — from community managers and customer success pros just like you

New Boilerplate Theme: A New Way to Create Beautiful Themes with Vanilla

When Vanilla Forums was created, one the core ideas was that you would get a small, lightweight forum that you could then build upon. While customizing the look and feel of Vanilla has always been one of the hallmarks of our platform, we wanted to offer even a better solution for designers who wanted to get their hands dirty while future proofing their design.

Recently I sat down with Isis Graziatto, our lead theme developer, who has spearheaded a new project to make it even easier to create beautiful, functional and responsive looking forums. The result is a new theme called Boilerplate. It’s a new way for our team to allow people to take their designs even further, while allowing us to have a bit more control as we release new features.

Let’s take a look at this new theme, and what it can do for you.

You’re in control of your branding

As Isis said right off the bat “The best part of BoilerPlate is allowing people to stay on the version they design on, so if we need to make any breaking changes it does not disrupt their design. For example, the can stay on version Boilerplate 1.0, as I move to Boilerplate 2.0 -- this is a great change for us.”

As Isis explains “Boilerplate is starter package, which gives you everything you need to make a theme. It uses Sass, which is described as CSS with superpowers. By using the Boilerplate theme, regardless of which pages of Vanilla you are on, there is a consistency which was a bit harder in some of older themes. So now we have this variable sheet, which is inherited to all the pages, so we can ensure a better experience across the community.”

To get an idea of how Boilerplate looks right out of the box, take a look at the image below.

Another great thing about BoilerPlate that Isis shared is that it was built from scratch, so it’s 100% mobile responsive, without the need for customers to use a mobile theme or to make small tweaks to our existing themes.

For Isis, this theme is also about efficiency. She uses the Boilerplate theme to create all customer custom themes. Here’s what Isis had to say about how she’s using the theme now:

The Boilerplate theme gives me a solid foundation to start with, and from there I can work with a customer’s mockup and make it a reality. Also, because I thought the Boilerplate theme was so helpful for me, we’ve made it available for anyone using Vanilla who wants to get their hands dirty and create their own design. Everything they need is in this package. Customers can add their brand colors in Boilerplate and it will be applied to the community across the various pages. I think this is something that will make customizing Vanilla much much easier for everyone.

So how does one get started with Boilerplate? To take advantage of the latest technologies, this takes more than a simple download. For example to get your copy of Boilerplate you’ll need to install Node and Yarn as prerequisites to use this tool.

However, I should point out that even I was able to follow along the docs Isis has put together and get myself a copy. You can check out her very detailed docs here. I was able to get up and running quite quickly, so I’m sure you can do the same. It’s also a much easier and simpler way to get going, by selecting your brand colours, and constructing good looking themes.

Finally, we’ll give Isis the last word. When I asked her what she wanted the world to know about this project, she said, “It’s simple. Boilerplate is available now and it’s open source. Go get it and start playing with it!”

We hope you do and we’d love to see what you come up with! Make sure to share below, and I’ll make sure Isis sees it too.