Our Travel Blog: How it works

Late last year I was lucky to be heading on an around the world trip with my girlfriend for a couple of months. We wanted a travel blog so we could share some of the highlights of our trip with friends and family back home (without spamming social media).

I considered using exposure.co as I really like how easy it is to use, however I wanted a little more control over the design & the functionally.

How it all works

• A simple custom responsive WordPress theme – there are only a few templates (index, single) as most of the code I wrote was Sass to power the flexible image galleries.
• Advanced Custom Fields Pro – I’ve setup a field group that appears on the posts page which lets me curate the images shown on each post (using a relationship field) as well as the location (google maps field) and introduction (text field). I also have fields for panoramic images and long form story writing incase we needed them.
• Designworks Intagram Importer – to automatically import images from 2 personal and 1 shared (private) Instagram Account into a Custom Post Type in WordPress. It also includes meta data like location which I may use in the future to plot the images on a map.
• MailPoet – to manage a small set of newsletter subscribers, it also has a simple interface which lets you design and track the emails it sends out.
• WordPress SEO – I’m really only using this for the open graph meta tags which let me control how the links appear if shared on social networks.
• Beanstalk – for version control with git & auto deployment to my server (this came in handy while overseas as I could add small features or fix bugs from my tablet or at an internet cafe).
• Posting – every few days when we had downtime (like waiting at an airport or on a train) I’d create a new post, select a few images for the gallery, add a location & post it. Then roughly once a week I’d send out a newsletter to our friends and family with a message and a link to the blog to see our newest photos.

A couple of the other features

• Header / Logo – I’m using a jQuery plugin Flapper to emulate the split flap tickers seen at airports. Every 5 seconds it switches between ‘Ruts & Bel’ and ‘TravelBlog’.
• Lightbox – I’m using a jQuery plugin swipebox for the image light-boxes, I like how it displays captions on a desktop and how nice the swipe works on iOS.

You can checkout the travel blog in action over at www.rutsandbel.com if you’d like to use this theme on your own travel blog, let me know as I’m thinking about making it Open Source soon.