A highly opinionated workflow and development framework for wordpress
WoodChippr uses Timber for bringing better separation of concerns in relation to application structure, and the Bones starter theme to provide some niceties for bringing wordpress under control.
This theme comes with a large array of opinionated defaults. This includes the following plugins:
- Force Regenerate Thumbnails: for those irritating times when you need to add a new image size and regenerate all images
- Yoast SEO: For SEO
- Imsanity: To stop users uploading stupidly large images
By default WoodChippr includes some tracking code in the header. If you don't change this it will remind you with a big ass h1 before your site code starts. To change this either edit
views/partials/tracking.twig, or change
Who should use this project?
Anyone who has experience creating Wordpress themes, and tends to use Wordpress more as a web framework than a blogging engine. This project aims to extend the famous 5 minute install process for theme developers, by giving them a complete development environment complete with package management and frontend development tooling out of the box.
PLEASE NOTE: As this framework is designed for theme developers, the actual theme itself is the bare essentials needed to make a theme appear in the Wordpress appearance section, with a few extras thrown in to provide helper functionality.
- Place files on server
npm run buildto minify assets
- Fill out and rename sample.env to .env and wp-config sample.
- Install Node
npm run setup(if you want to install ACF)
- 'composer install' to add new php modules
Depending on the plugin here are two recommended approaches to requiring plugins for your theme:
- Include the plugins in the
composer.jsonfile, this will install the mu-plugins folder.
composer create-project tgmpa/tgm-plugin-activation --no-devin your theme directory, it is recommended to do this in the
functionsdirectory. this will set up a TGMPA instance in your theme, check
example.phpfor instructions for stipulated recommended or required plugins for your theme. You should use this method if the plugin does more than provide utility functions for your theme and requires the plugin activation hook to fire.
At the moment, you can optionally activate both es6 features like import statements and arrow functions but setting
config.json, and you can also integrate modernizr by setting
true in the same file. Modernizr can be configured using
At the moment extended babel configuration has to be modified in
/gulp/babelConfig.json, though I am looking to improve this configuration setup to be more centralised in the near future.
Project Structure and Bundles
At the moment project structure is recorded in
config.json. Out of the box it shouldn't need modification. Unlike the
.env file, the
config.json file contains variables that should be expected to be constant between build environments.
This is all a personal project at the moment that I use to help smooth my personal frontend development workflow. If you find any issues or have a feature request please do create an issue and I will do my best to attend to your request. It would be nice to see other people finding this useful, and it's also to my benefit to make this setup as flexible and useful as possible.