If you have developed WordPress sites for clients this process might sound familiar to you:
- Get a new client that wants a wordpress site
- Download the most recent wordpress
- Find a good current blank wordpress theme to start implementing the design
- Upload to a staging server to for client to see
- Client requests changes
- You make changes on local server, then upload to staging server
- Repeat last three steps until finished and then you deploy the site to live
After lots of trial and error, I have come up with a process that is more efficient, and allows rapid development of wordpress sites. I use Git, Git Submodules, and WordPress child themes to get going quicker and keep code up to date with minimal effort. (If your not using a revision control system like Git or SVN for development, then check out
this funny question and answer session on Stack Overflow Update: Stack Overflow moderators removed the question… bummer. Check out the funny-ness in the wayback machine internet archiver instead)
For this rapid WordPress development cycle, you will need to have Git installed.
1. GET THE MOST CURRENT WORDPRESS
The wordpress core dev team uses SVN to manage wordpress development. But I want to use Git for speed and easy branching. Fortunately there is a great WordPress git clone that is updated every fifteen minutes. To get the most recent version of WordPress, simply clone that repo to your project directory.
mkdir projectA git clone https://github.com/markjaquith/WordPress.git ./projectA cd projectA git checkout origin/3.2-branch
Now you have the most recent version of wordpress, and it will be easier than ever to upgrade wordpress and revert if something goes wrong. But we will get into the upgrade process later.
2. STARTING WITH A QUALITY BLANK THEME
To help get your new WordPress project off the ground, let’s get a quality blank theme that updates regularly. I usually use theRoots theme, which is a quality HTML5 wordpress theme that updates regularly. To make sure our theme stays up to date with the latest wordpress updates, we will add the Roots theme as a Git Submodule. This allows us to essentially add a git repository inside of another repository. Why do this? Because we can update our theme code to the latest release with a simple Git command, instead of downloading and merging on our own. To add the sub-module, change to your project directory and add the sub-module to the themes folder then initialize it:
cd projectA git submodule add https://github.com/retlehs/roots.git ./wp-content/themes/roots git submodule init git submodule update
Update: I have now forked mark’s wordpress git and added roots as a submodule. You can simply clone or fork my repo to save a step. Get it here: https://github.com/clintberry/WordPress Make sure to clone recursive to get the roots theme. This repo updates nightly to the latest wordpress and roots release.
Now you have a quality blank theme installed into your git repo as a sub-module.
3. ADDING YOUR CUSTOM DESIGN (WORDPRESS CHILD THEME)
Since we have added the new blank theme as a git submodule, we don’t want to edit that theme directly. This could cause problems when/if we want to update our code base for the theme. To better avoid update problems, we can use the often-under-utilized-wordpress feature called child themes. Child themes allow you essentially “inherit” all the functionality of a “base” theme. In this case, we will create a child theme “MyTheme” that will have access to all the functionality of our base theme “Roots”.
Creating child themes in wordpress is simple:
- Add a new folder to your wordpress themes directory called “MyTheme”
- Create a file called “style.css” with the following text:
/* Theme Name: MyProject Theme URI: http://clintberry.com/ Description: Roots Child Theme Author: Clint Berry Author URI: http://clintberry.com Template: roots Version: 0.1.0 */ @import url("../twentyten/style.css");
Take notice of the “Template: roots” field. That is what lets WordPress know that this is a child theme and to inherit all of the roots functionality. Also since this style.css file overwrites the roots css file, we import the css file from roots.
- Create a functions.php file to add any custom WordPress functions. WordPress will load your new functions.php file along with the Roots functions.php file, so all is well.
- Copy any template file you want to change from the Roots theme to your new child theme directory. Any template file found in your new directory will overwrite the template in Roots.
Now you can start your theme development with an HTML5 bang! Child themes make it much easier to get started and even keep your file structure a big cleaner.
UPDATE WORDPRESS LIKE A PRO
Yes, you could update WordPress in the admin panel, but you want to do it in a much cooler, easier-to-revert way. With Git, now you can. First, backup your database. Then in the root wordpress directory, update your Git repo by using git fetch:
git fetch origin
Now merge in any updates from your current branch, or merge in a new branch altogether. This command merges the latest update from the 3.2 branch into your WordPress install:
git merge origin/3.2-branch
Now you have the most recent version of WordPress. It is a beautiful thing.
Don’t worry! If it breaks something, it is easy to go back. First enter:
This will output the most recent changes to your repo. Look for your last change which was merging. It will have a line like this:
Merge remote branch 'upstream/master'
Take the commit sha (the long number right after the word commit) that is located on the commit before the Merge line. Take that sha and enter the command:
git reset --hard your_sha
Now restore your database and you are back in action.
EASIER WORDPRESS DEPLOYMENT
Deploying a WordPress site has always been a thorn in my side. Currently, I am developing a plugin for much easier deployment, but for now things are a bit hairy. The nice thing about git is keeping your code base up to date is much easier. Unfortunately, Git doesn’t help much with the database side of things, so we will focus on just the code base for now.
DEPLOY USING GIT CLONE
Deploying with Git Clone is the easiest way to get your code installed on a different server. All you have to do is push your repo to a remote repository (like github) and then clone it directly on the live server. This allows easy updating in the future as well since a simple git pull is all that is required to get the most recent code base. If you don’t have SSH access or if the server you are deploying to doesn’t have Git, then this method won’t work.
OLD SCHOOL FTP
For a good guide on deploying the old fashioned way, as well as deploying the database, see This Post
I hope this helps getting your WordPress sites off the ground quicker and easier! As always, any comments or suggestions are welcome.