Growing A CSS Zen Garden Using WordPress Default Themes

Konstantin Obenland who worked on the default theme for WordPress 3.8 published a post that provides details into the development of TwentyFourteen. Konstantin shares some of the lessons learned throughout its development and explains what direction TwentyFifteen may take.

I think it would be great if we could combine the two approaches, start from scratch and use an existing theme, for Twenty Fifteen. Let’s create a theme design from scratch, much like Twenty Twelve and Twenty Thirteen, and have it be based on _s, as the pre-existing theme.

However, a cool idea sprang from his post. A CSS Zen Garden like website but for WordPress themes. CSS Zen Garden showcases what’s possible with just CSS. The HTML structure stays the same, while CSS provides all of the visual elements. The idea proposed for WordPress is to use a simple theme like _s and apply changes only through the style.css file.

But most importantly: Let changes only be in style.css. That’s it! No additional functionality or bloat. If anything, we take unneeded code out. This doesn’t mean it can’t look good. It doesn’t mean it will be less awesome than its predecessors. CSS is a powerful tool, if in the right hands.

Not A New Idea

In 2005, Alex King hosted a WordPress theme competition for WordPress 1.5. Entries were composed of changes to the style.css file for the WordPress 1.2 template and 1.5 Classic Theme. The WordPress theme landscape was much different during this time and through competitions like Alex King’s, WordPress users instantly had a larger variety of themes to choose from.

As an aside, this comment by Lance Willett provides some food for thought. Basically, instead of themes becoming more complex, perhaps the core of WordPress needs to have more features and improvements so code heavy items are taken out of the theme. Overall, I think a CSS Zen Garden like website for WordPress default themes is an excellent idea.

9 Comments


  1. Great post. I think themeing with mostly CSS is a great idea that should be explored. I also agree that themes shouldn’t contain lots of ‘features’. Themes are supposed to control how your site looks. I’m not a fan of themes that have lots of extra features and options that aren’t really integral to the theme itself. Leave that stuff to the plugins, or possibly WordPress core itself.

    Report


    1. So the idea based on what I’ve read is that the core of WordPress should contain most of the heavy handed features we see in themes. That way, all of the code used for those heavy handed features in themes can be removed thus, lessening the complexity and baggage of the theme itself. Themes would then tap into the core of WordPress to use a slider, pagination, or other commonly used features that need to be coded from scratch.

      In this light, themes become less about PHP and more about CSS/Visual elements to set it apart. Theme designers can get back to concentrating on the presentation of content, not the structure of it.

      Report


      1. +1 to this whole idea, especially getting back using primarily CSS for themeing. Use JavaScript if you need to get fancier than what CSS3 can do. Save the PHP for core and plugins!

        Report


  2. I studied the various sites in “CSS Zen Garden” over and over back in the olden days. :-)

    It never ceased to amaze me what people could do with the SAME HTML code and text to produce totally different sites.

    I believe the same thing can be done again via the idea in WordPress. Outstanding!!! Go for it!

    Report


  3. The competition all those years ago was fantastic, but it was the Kubrick Default Theme that was focus of the competition, not the Classic Theme.

    There was another big competition with the then new Sandbox Theme by Alex Skelton and Scott Allan Wallick. The goal was to do the same thing as mentioned in the article with the Sandbox Theme as a form of blank canvas in 2006. The work done with that Theme helped to bring attention to the WordPress.com “Extras” to pay for access to the stylesheet of any Theme and customize it.

    Other competitions to repeat this have been hit and miss, but if done right, and there is reward enough for it, no reason why it can’t be a huge success this time.

    I’ve always loved CSS Zen Garden and have begged for something similar to demonstrate the power of WordPress Themes and designers since the introduction of WordPress 1.5 modular Themes. About time it got rocking!

    Report

Comments are closed.