Local, Dev, Staging, Production WordPress Workflow

I just wanted to share real quickly (because I’m pretty stoked) that after months (really, years) of development I finally have what I consider a professional workflow for WordPress development.

Below is a graphical representation of what takes place. But it breaks down to this (with Git, but can easily be accomplished with SVN as well):

  1. Pull down the Github repository
  2. Develop locally at local.example.com
  3. Commit changes and push to Github
  4. Push to Beanstalk if you want changes immediately pushed to dev.example.com
  5. Merge master to production and push to Github and Beanstalk
  6. The production branch is automatically deployed to staging
  7. Manually deploy to production from within Beanstalk

Notes:

  • Local and Dev share a database (but don’t have to)
  • Staging and Production share a database (but staging only has read access)

WordPress Workflow

 

You can fork the Denton Bible Church Website even if you just want to use this is a framework for your project.This is built off of Hybrid Enterprise which is a cleaner repository that accomplishes the same thing.

Finally, and sadly, I am still looking for the best multi-environment database solution. Ideally, a fourth environment would be used to make content changes against the latest production branch code and then changes would be selectively deployed to the production database. WordPress 3.6 almost had a great solution.

Vote & Verb Denton

A dual announcement post…

#1: Vote Denton

A group of developers, designers, & Denton enthusiasts got together less than a month ago to discuss the problem of local voter turnout, lack of education, and lack of accessibility to that education. I’m a prime example. I’ve never voted in local elections and never paid much attention to it despite having a friend that is super involved in local politics for his district. Set aside our ambitions to help solve this problem, because the most exciting thing for me is that a group of Dentonites loosely tied together by friends of friends got together and turned around a project in a short amount of time.

Vote Denton logo

Vote Denton has a simple goal: make voting easier in Denton, TX. For now, you can get some basic information about local elections in addition to finding out what district you are located within. From there, you can go to the county’s website to find ouf if you’re actually registered to vote and registered in the right district — a feature we plan on rolling into Vote Denton soon.

#2: Verb Denton

I’ve had my hand in Vote Denton, Create Denton, Hear Denton (now defunct), and I see all sorts of “{Verb} Denton” sites out there. I brought a lot of them together under one roof as a sort of starting point to get connected and to Verb Denton.

Verb Denton logo and tagline

#3: It’s all open source

Both of these projects and be found on Github, are publicly accessibly and anyone can contribute. Openness & collaboration makes these services better.

Settling the WordPress Absolute vs Relative URL Debate

WordPress is somewhat notorious for using absolute URLs in its linking to images and other posts within content. Many have argued for both sides.

It’s quite simple for me: relative URLs are easier for development, absolute URLs are smarter for live websites.

There’s a compromise to be had.

WordPress should add these shortcodes to core:

  • [home_url]
  • [uploads_directory_url]

This enables the user and the WordPress editor to insert links to other pages and media on the site while maintaining its given site domain and path. Developers would no longer have to find and replace all instances of the home URL when importing a local database to another environment.

When linking to another page on the site, WordPress could insert [home_url]?p=203, maintaining a lifetime of environment changes and domain moves without broken URLs.

Or, when linking to an image: [uploads_directory_url]/2013/01/example.jpg. Actually, I think linking to media needs to be completely rethought (i.e. [media id="100"] would render whatever image path was associated with that media ID. This would allow you to update an image in the media library and have the image update everywhere it exists on your site).

We all started somewhere, right?

This is a humbling experience.

I was inspired to compile these because of @justintadlock‘s tweet.

I went back to oswd.org, the birthplace of my HTML debut. I built all my websites from 2002ish to 2006 in Flash (which sounds like a REALLY long time now). My introduction to HTML and CSS coincided with open source web design very nicely. Unfortunate for the Internet, though, I released seven simple HTML/CSS designs in 2006. Soon thereafter I found WordPress.

Five years later I hope I’m doing better.

Also … ugh … they’ve been downloaded a combined 79,644 times.

1

2

3

4

5

6

7

Theme revisions and WordPress cache busting

When you enqueue CSS or JS files WordPress will append the current WordPress version as a parameter … an attempt at cache busting.

The process by which sites or servers serve content or HTML in such a manner as to minimize or prevent browsers or proxies from serving content from their cache. This forces the user or proxy to fetch a fresh copy for each request. Among other reasons, cache busting is used to provide a more accurate count of the number of requests from users.
- IAB

This type of parameter on your static resources is semi-useful. When you upgrade your version of WordPress returning visitors will be served with a fresh copy of your files. But what about all those changes you made to your style.css in between WordPress upgrades?

I use Beanstalk as my SVN repository host. Their coolest feature is automated and manual deployments. Simply commit your changes locally and watch them deploy to your staging/production server within seconds. No FTPing (and no accidents). Beanstalk puts a single file in the root directory of wherever you’re deploying to called .revision. It contains a single integer which is the latest revision that was deployed. You could manually update a file like this if you don’t use deployments.

So this function below grabs that revision number. You can then place this function in your enqueue call to replace the default WordPress version parameter with the latest SVN revision number … busting caches when they need to be.