How’s ImageArcade Made? - (February 12, 2010)

How’s ImageArcade Built?

Every now and again (well pretty often to be honest) I receive an email from someone who’s seen ImageArcade and has a question related to how it’s been constructed, how I’ve done x or who did y etc. I like to help people out and try to reply to all these mails, however, to save myself a bit of time here’s a quick guide to some of the most common questions. Oh and if your mail goes something like “great site; please can you send me all the code and help me build my site totally free?” then as nice as it is to receive complements you might not get a reply :-)

The Basics

ImageArcade is built using WordPress. WordPress is a free blog and general CMS authoring tool that runs on PHP. It’s quick and easy to get up and running and is incredibly flexible and scalable. After all the WordPress site is built on WordPress itself and receives more hits than ImageArcade will ever get (well you never know!). The idea is that you can take a ‘theme’ (there are tens of thousands of them out there), apply it to your WordPress installation and away you go. ImageArcade originally used the Black Canvas theme from StudioPress (see here) as well).


Taking WordPress A Step Further

Once you have some content on your site and you’ve learnt your way around WordPress you’ll want to start customising the site over and above what the pre-defined template offers. The first thing to do here is make sure you understand the template structure of the theme you’re working with. Once you have an understanding of this and some basic PHP knowledge you’ll be able to make changes to different areas of your site to get the design that you want. There are thousands of plug-ins built for WordPress that allow you to add additional functionality with little or no changes in PHP or to your template files.


Adding The Nice Touches

The most common questions I receive are related to the nice graphical and interactive features on the site, for example the image rotator on the home-page or the fish-eye menu on the portfolio page. These are all achieved with JQuery. JQuery is a library of commands and functions that are written in JavaScript; web developers can use these functions and libraries to create simple yet very effective tools to cover many usage scenarios. These tools are generally packaged as ‘plug-ins’ and whilst they are not the same as actual WordPress plug-ins and do require some css and php coding, as a general rule they are quick to pickup and often work in very similar fashion to each other. Below is a list of some JQuery plug-ins that are used on ImageArcade or that I’ve seen and thought worthy of a mention.



My business background has been related (although not directly) to web development for the last ten years. This has undoubtedly helped me in producing ImageArcade, but WordPress and associated extensions aren’t a difficult technology to learn. If you invest a little time in them then you’ll get the reward pretty quickly.


If you need coding help with a project, or feel that I may be able to offer something to a project (be it photographic of not) that your involved with then shoot on over to the contact page and drop me an email!


Checkout the links page here also!

Comments - Please feel free to leave a comment. I'd love to hear what you think.....