WordPress staging site with GIT

WordPress staging site with GIT

If your WordPress website is more than just a “static” site with a blog, ie, you are running an actual application with custom developed code then you probably want to set up a staging environment to manage your updates.

In this example we’ll take a look at managing our workflow using Bit Bucket as our GIT repo and using the excellent Github updater plugin (which inspite of its name does work with Bit Bucket).


Setting it up

Your first step is to set it up. We need two wordpress environments (actually three because your dev should be separate but in this article I’ll assume the dev setup is on your local machine).

I’ve set up http://staging.demoserver.co.za and http://live.demoserver.co.za and installed the same version of wordpress on both of them.

Next, on my local dev server I create a very simple plugin (called “simple-plugin”). This plugin adds an HTML comment just about the <head> section on our pages in wordpress. I’ve have that under git control so I init and commit my new files.

Now, on Bit Bucket I create a new blank repo called simple-plugin. I don’t add any of the recommend things like a readme because that will come from my local repo.

Now, I use Bit Bucket’s instructions to copy my local repo to their repo:

From the command line and from my local repo direcory:

    git remote add origin git@bitbucket.org:username/simple-plugin.git
    git push -u origin master
I now have my local plugin repo and my Bit Bucket repo synced… Onwards, and upwards!

Installing Github Updater

There are various methods to install the Github Updater plugin. I’m going to use their git installation method.

On both my live and staging servers I simply (from the command line) navigate to public_html/wp-content/plugins and then run:

git clone https://github.com/afragen/github-updater.git

After that I activate the plugins in the usual way.


Adding the Bit Bucket Tag to the plugin

In order for this to work we must add a declaration to our plugin’s header to the URI of our Bit Bucket repo.

We add * Bitbucket Plugin URI: https://bitbucket.org:username/simple-plugin to our plugins header to it now looks like this (note that that URI does not end it .git):

 * Plugin Name: Simple Plugin
 * Plugin URI: https://softsmart.co.za/2018/10/15/wordpress-staging-site-with-git/ ?
 * Description: Simple plugin to demonstrate using github updater
 * Version: 1.0.0
 * Author: John McMurray
 * Author URI: https://softsmart.co.za/about/
 * Bitbucket Plugin URI: https://bitbucket.org:username/simple-plugin 

As we made a change, we commit in our dev repo and push to Bit Bucket.


Install our plugin on live and staging

To install our plugin from our bit bucket repo we get the bit bucket clone url and simply run git clone uri on our server in the wp-content/plugins directory.

We do this on both our live and staging environments, so initially they’re identical.

Updating your plugin

So we’ve now created a version 1.0.0 of our plugin and uploaded the repo to BitBucket. We created a staging and live server and installed our plugin from Bitbucket using the Github Updater plugin.

We also remember we have a slight bug in which the \r\n characters are now being parsed as new line carriage return. This means those characters show up at the top of all our pages.

A quick look reveals that the issue is we’ve used single quotes which means those characters are sent as literals to the browser.

We change our echo to use double quotes, but we also change the message a little.

In our plugins header and read me we also update the version number to 1.0.1 then we commit and push.


Where is the update in WordPress?

At this stage you might be checking your wordpress pluings page and hoping to see the plugin say that there’s an update available. The one caveat to be aware of with GitHub Updater is that it uses WordPress cache timeouts of 12 hours, meaning it only checks for updates once every 12 hours.

So your best bet is to go away and look tomorrow and then the update should be available. Of course there are times when updates are required more urgently. In that case go to the settings page in GiHub Updater and click on the button to clear the cache. Then head back to your plugins page and the update should now be available.


John McMurray is a freelance PHP developer. Experienced in PHP, Laravel and WordPress he can code anything you need.

Based in Plettenberg Bay, Western Cape I am available for PHP, Laravel or WordPress freelance jobs in Johannesburg, Pretoria, Cape Town, Port Elizabeth. I also often do remote PHP freelance work all over South Africa and the rest of the world.


Leave a Reply

Your email address will not be published. Required fields are marked *