Timber is a WordPress plugin that allows one to use the Twig template engine for WordPress theme development. Gulp on the other hand is a toolkit which let’s one setup a quick and nearly automatic Front End asset workflow.
In this article we’ll cover the pros and cons of the theme development using all of these tools based on a Front End and WordPress development framework called Chisel.
Typical Development Approach
Most of the themes, especially found on wordpress.org consist of the main style.css file and a set of corresponding .php files that render the corresponding HTML markup. Even though the developers are asked to put all of the logic within the functions.php file (ideally separating into wisely distrubuted modules), the reality is that such themes are usually a mixed bag of everything:
- Inline CSS styles
- PHP logic placed within the templates and mixed with HTML
- Multiple script and styles not combined and minified into a single file
While at first glance such a structure seems ok and is probably easy to understand (and start with) by the person who created it. It comes with a lot of problems that emerge as the theme grows in more features:
- Problematic creation of php extensions (so called Back End functionality)
- Problematic visual fixes (due to single / or multiple .css files)
- Mix of logical and visual layers
In a nutshell such a structure is usually pretty hard to overwrite, modify or extend. The problems come from the fact that this approach is a mixed bag of everything, since there’s no way to enforce any set of rules one should adhere to. Obviously there are programmers who are precise and patient enough to create something extremely easy to use and create however with such a structure it’s not an easy task to do.
Summing it up, the typical theme development requirements are:
- Easy to comprehend
- Easy to start with
- Hard to modify and extend
The Chisel Approach
Bring your WordPress development to 2018. Use the power and simplicity of Timber. Make your CSS scalable and maintainable with ITCSS. Get rid of tedious manual tasks with Chisel’s modern development workflow.
This quote is a perfect summary of the power that the tools bring upon the theme development. We have a forced separation of .css files (.scss to be precise), automatic task management, forced separation of logical and visual layers. By saying forced I’m not refering to the constraint of doing so, by forced I’m referring to the fact that such a separation is subconsciously making one have a clean setup of the site assets and one’s code structure.
In a nuthsell such an approach makes the theme development much faster, easier to maintain and finally easier to extend.
However there are some cons to that approach that may discourage one of learning the tool. Let’s outline them really guick:
- These tools need to be learned
- There are some strict contstraints that may not be liked by easy-going developers
- The process requires configuration and installtion of external tools that take some time to get used to
I believe that solid plan and solid preparation make up for the time spent on anything. Such rule applies to everyday routines. It’s not a secret that people who have more preparation and a better plan usually end up having better and easier lifes. Hence in my humble opinion each and every developer should take the risk of losing some of the development time for learning new (and at first glance hard) tools instead of getting to the coding right away.
Latest posts by Rafał Gicgier (see all)
- WordPress application development ACF & Gravity Forms - 3 August 2019
- OptiPic.io – How and why to optimize the image on the site? - 8 April 2019
- Guest post at WP doin! - 26 March 2019