Martin Lucas Hello there!

My name's Martin Lucas and I'm a website designer, casual photographer, part-time DJ, sporadic blogger, Apple fan boy and social media obsessive. This is my portfolio slash blog. Beyond these pixels you can find me on Twitter, Tumblr, Flickr, LastFM, LinkedIn and Vimeo.

Terror Flieger War Log Website

March 14th, 2010 in Design

Terror Flieger War Log website buildThis project came to me a little out of the blue, it’s not something I’ve built before – or a type of website that I have come across previously. A War Log or War Diary, a journal kept by POW’s in World War 2. Nick wanted to display scans of his Grandfathers in a smart and sequential way on the Internet, in terms of how the website would work Nick was very clear about having thumbnails of all the pages running along with bottom of the site and having a zoom function to view in detail the pages. It was my job to translate this on to a design that works.

Wordpress
I was positive that Wordpress was the right solution to build the log on to, I thought it would be a neat idea to put it together as a blog, but all the posts dated in 1944 rather than in present time. Ultimately this wasn’t possible as much of the content wasn’t placed in time sequence, newspaper articles were placed some at the start, some at the end and not all in date order.

Quickly becoming one of my favourite Wordpress plugins, Get The Image was used to extract a thumbnail, nominated via a custom field, so links to the individual pages could be linked to via the archive log pages and along the footer. Another plugin, Magic Zoom, was used to show the detail of each of the images on the posts.

Internet Explorer Bug
This nearly threatened the footer and it’s functionality, I used a sliding gallery JQuery script that I found on JQuery for Designers, the script worked fine while adding the content to the website with only 20, 40 and 60 pages, but once all 170 pages were on the website the footer caused the website to crash in Internet Explorer 8 only, Safari and FireFox worked perfectly.

I initially thought it may of been too many images being used, then while trying to debug the issue I was leaning towards how the footer was put together. I sought help from my Twitter followers and placed posts on the Wordpress and Boagworld Forums. In the end it was suggestions from @paulvelocity that lead me to go through the style sheet one line at a time, the result was the display: inline property on the li element that forced the footer thumbnails to display in one long continuous line. Changing it to inline-block fixed the crashing issue in Internet Explorer. Definitely a frustrating time in the project build, and I was very relieved to get it fixed.

This was a great project to work on, it taught me a lot about the flexibility of Wordpress while continuing to use it’s plugins to gain more functionality out of this powerful CMS. I’ll definitely be using custom fields again in the future to add in bespoke elements to pages, posts and the theme.

View the website here; http://terrorfliegerwarlog.co.uk

Tags: , , , , , ,

    • View my Flickr Photo Stream