The concept “minimal viable production” is a common concept in agile projects. I’m working on a minimal viable WordPress theme. The rules are:
- The theme must validate according to WordPress Standards.
- The design is not important.
So it’s all about function then. You can follow the development of the theme here (petj-mvp).
The design is inspired by the first WordPress theme: Kubrick.
How to make and debug a WordPress theme
- Debugging in WordPress.
- Debug bar.
- Developer Docs.
- Theme Developer Handbook:
- Template file checklist.
Nodejs is a must in rapid development. Here are some essential tools.
Much template work is tweaking the CSS. A stylesheet preprocessor is a nice-to-have. Here’s how to use SASS:
sass --watch input.scss:style.css
Bower is a nice package manager. Install libraries, e.g.:
bower install jquery bootstrap jquery-ui --save
The libraries are saved in the bower_components directory. The –save option will save dependencies in bower.json. If you download a repo without dependencies, they’re installed in this way:
Yep, that’s it.
Bower is installed via npm (part of Nodejs):
npm install -g bower
Here’s a link to (my work-in-progress) theme:
Github is made for group work. Code may be forked into branches, and versions merged to a mutual production.
Projects will give the group a nice kanban for work organization. Users may rise Issues.
Ready for Upload
When all is ready you can upload the theme for review on WordPress. Delete whatever files and directories that you don’t need.
Hidden files and directories must be removed.
If you use minfied scripts and css a non-minified version should be available. The files in the WordPress theme pool should be in clear text.
Then you can try to upload the theme for review.
One thing is to review themes. Another is to get it through the needle’s eye. Here’s the quest.
- Hack a theme that’ll meet all requirements and WordPress standards.
- The aim of the theme is to teach how to write a theme.
In this way the theme will be usefull not only for me, but for anyone who wants to learn how to make a theme.
The core-WordPress themes don’t use preprocessors and similar. They want a clear and easy to read code. The aim of the core themes is to teach the art of theming.
I’m working on a LAMP server. So the code and methods will be easy to follow for any *NIX user. But we should not forget Windows users. Here’s a challenge. I don’t use Windows any more.
However in the business rapid development is often used. My approach is to develop a theme with Nodejs tools, such as:
- Bower (package manager)
- Sass (CSS preprocessor)
- Gulp (compiling, automatic test)
- Github will play a major role for versioning.
The theme is an attempt to follow WordPress coding standards. Theme review tools, such as debugger plugins and code sniffers will be used. So will the theme debugger plugin. And of course the debugging features in WordPress must be activated. Edit these lines in wp-config.php:
// Enable WP_DEBUG mode define( 'WP_DEBUG', true ); // Enable Debug logging to the /wp-content/debug.log file define( 'WP_DEBUG_LOG', true ); // Disable display of errors and warnings define( 'WP_DEBUG_DISPLAY', false ); @ini_set( 'display_errors', 0 ); // Use dev versions of core JS and CSS files (only needed if you are modifying these core files) define( 'SCRIPT_DEBUG', true );
Multimedia designers tend to love animations. I’ll make a theme with many creative features, such as:
- Animated splash frontpage (demonstrate costum pages).
Something along these lines. You know: floating goblins, fairies, and creatures out of norse legends of old. That kind of stuff.
I’m working on a didactic template with these features:
- Bootstrap (for responsive web design)
- Wp-navwalker (for the menu)
During the development I’ve used SASS and Bower for rapid prototyping. The theme was validated by the theme check plugin.