Another Lone Gunman's Blog

February 14, 2010

My first crack at building a map with a CMS

I had my bare land rover(Joomla’s CMS) ready for testing, I just had to decide what tools and modifications I needed first. As the intention of my map(website) was to show the world my animals(products) so they could purchase one for themselves. I needed a tool to catch the animals, show them off and allow people to pick and choose what they want.

After some research, the best system for Joomla to catch animals was Virtuemart’s shopping cart. I also found out that someone had pre prepped Joomla’s land rover with Virtuemart’s animal catching devices, so I chucked away the bare landy and set up the pre prepped version. I then caught a few animals and tested how they were all displayed, it seemed to function well.

Next was to break down my map into its three elements, as I explained in the previous post. I had looked at some of the functionality and done some modifying of the land rover, I had tested the map and how my animals and info worked, but before I shoved all the info in I wanted to make sure it would look right.

The visual elements:

After looking for themes for my map and trying a few, I eventually decided on using the theme that cam with my pre prepped land rover, it had all the functions pre built-in and everything was roughly where it needed to be. I just needed to give it my own identity, to make it my map.

This initially looked almost impossible, there was no way to use a visual editor, it was all code, and not just one type of code, three types of code. I had played about with some basic html in the past but knew almost nothing, now I had to deal with CSS and PHP as well!

All was not lost though, All I wanted to do was change some colours and pictures. I started with the colours, I just use a colour code picker to find out what the code was for each element I wanted to change, searched for it in the script and replaced it with my new colour. I then discovered that not all the colours in the theme were code, some of them were images. I found out where they were stored, got a can of spray paint (Photoshop) and repainted them a new colour, easy as pie! I then worked out what other images I wanted to change like the logo and shopping basket icons replaced them with some fresh parts.

I now had a map that looked they way I wanted it too, bar some things being in the wrong places but they were not in the theme, they were my land rover was set up to put them. To finish off the visual aspects I now had to pop the hood of my landy and recalibrate a few bits.

The second element: Setting up and modifying your land rover

The first bit I tackled was getting all the menus, links and blocks or widgets in their relevant places. Just a case of scratching around under the hood and working out what all the little bits are and how to use them. I then started planing out and adding menu trees, not everyone wants to look at my whole map, most are just after something specific so the clearer the menus are the easier it is to meet their needs. Finally I had to add all the smaller functions I wanted like some binoculars(google analytics) and configure my landy to suit the animals I needed to display.

The Third element: Catching animals and showing off different areas

The last step was to get all the info I wanted to show the world up there, I had to catch and display my animals so people could buy and I had to show people more about my area so they understood more about the animals they wanted.

I now had a functioning map that looked good and did the job:

here it is :

If only this was the end. Something I have learnt is that a website is never finished, it needs to live, grow and adapt! (and the odd bit of repairs)


Leave a Comment »

No comments yet.

RSS feed for comments on this post. TrackBack URI

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

Blog at

%d bloggers like this: