Skip to content

Instantly share code, notes, and snippets.

@reinier
Last active March 24, 2017 20:08
Show Gist options
  • Save reinier/c806c5ec8ad3e6906e66 to your computer and use it in GitHub Desktop.
Save reinier/c806c5ec8ad3e6906e66 to your computer and use it in GitHub Desktop.
How I develop Wordpress themes

How I develop Wordpress themes

This is my process for developing themes for Wordpress at the moment. I've come to this process because I want to deliver a clean theme while using the power of Gulp for Sass parsing and code/image optimization.

Vagrant for running Wordpress

I don't like to flood my computer with all kinds of tools for different kinds of languages all the time. PHP is one of them that I don't want to think about. Vagrant is a great solution to this. Everything you need for your Wordpress (Like PHP, MySQL etc.) you can get in a Vagrant machine.

With the help of PuPHPet I've made this Vagrant setup for my Wordpress development:

WP-dev-box

Gulp for Wordpress theme development

I like to use some build tools when developing a Wordpress theme. I minimally want to be able to do the following:

  • Parse SASS
  • Download dependencies (with Bower)
  • Optimize images
  • Minimize CSS/JavaScript
  • Deliver a clean wp-theme in a dist directory or a custom branch without all the development tools and stuff

An example of such a Wordpress theme is Ganymede (still work in progress)

How all of this comes together

One hack I had to made to Gulp is to copy files outside of the scope of the repository. That feels a little ugly but I have no other solution at the moment. I've tried rsync but that is just as ugly and more complicated and I've tried symlinking the build directory in the wp-themes directory but Vagrant doesn't play nice with it.

All the themes I'm developing are in the same directory as my WP-dev-box:

~/dev
-- /wp-dev-box
-- /theme-1
-- /theme-2

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment