Editorial theme for WordPress with Timber and Twig

Implementation of the beautiful Html5up's Editorial theme for Wordpress with Timber library using the Twig template system. Based on the skeleton of Timber Starter Theme.

Editorial theme for WordPress with Timber and Twig

Few weeks ago i was on the process to rebuild my own site (and making your own blog is ever a difficult task to accomplish). So i thought that was a good idea to let the design to someone else. Browsing the internet i came to the great Html5up site that hosts several free templates made in the good old plain html + css + js (JQuery) style. You can choose between three or four dozens of templates well designed mostly with a minimalist plain and modern style. You can use them freely because it are under the Creative Commons licence with attribution to the author. In this case i fell in love with the Editorial Theme. I wanted to make the site deploy very quickly and also versatile for blogging so i choose, again, a good old friend that powers a big portion of the internet sites of the world, WordPress.

So, the duty was clear, i have to implement the plain html template in the WordPress way. But you know that the WordPress themes are not so lyrically written, maybe in contradiction with their fine slogan “code is poetry”. But thinking it better it could be an ode to the Spaghetti. Away from jokes now, the code of the themes are very messy, mixing up html, php, css, and js sometimes. But the good news is there is a solution for this headache, his name is Timber. This plugin makes the life  of the WordPress developers easier implementing the Twig template system, so you can avoid the Spaghetti code. If you want to know more you can read this article about how Timber and Twig reignited the author’s love with WordPress.

For this reasons i decided to implement the Editorial theme in WordPress using Timber and Twig. The task was not complicated, and the Timber Starter Theme was very helpful doing that, the result is Editorial Timber Theme. You can find it ready to use in your WordPress Site on GitHub: https://github.com/matiasbenedetto/editorial-timber-theme

Out of the box support:

Out of the box the theme supports:

  • Pages and posts with excerpts
  • One main menu
  • One social links menu
  • Comments
  • Dynamic sidebar with custom widgets
  • Editable main hero section

Requirements:

The only requirement of the theme is Timber plugin installed on your WordPress.

Customizing:

I implemented Gulp for compiling and minimizing the sass styles and javascript code. So if you want to customize the code you need NodeJS installed and after run gulp for watch your changes. On the theme folder you should do:

cd /static/assets
npm install
gulp