portfolio & design blog of logo & identity designer, Graham Smith









As you can see from my Location page, I have a convenient Google map inserted. This is fully interactive and allows for full zoom and scrolling as well as being able to ask for directions from any given point to where I live. If you have a WordPress blog it’s dead easy to install and will add that extra bit of interaction and convenience for any potential client who may need to know where you live and how to get there.

There is also the possibility that the map will also show up in a Google search, further highlighting your company from all the others. I don’t have any confirmation on this, as there are many ways to add the Google API map to your website, my option focused on using a WordPress plug-in to make it super easy.

It’s just a few steps, so here we go.

1. Visit Google Code.

2. Sign up for a Google Maps API key. As show in the image below, the link is under ‘How do i start?‘. Once you have read the ‘terms’ on this page, you will be asked to enter your website URL, then you will get your Google Map API code, a stupidly long code at that. Here you will be faced with a number of options in how to implement the API. I decided to ignore these options and go for a WordPress plug-in option. Mostly because I don’t have much knowledge of the intricate workings of implementing API code direct into a WordPress blog.

3. We are finished with Google for now. Visit the Google Maps for WordPress plug-in page over at WordPress and download the plug-in. Read the instructions and install as any other plug-in.

4. Once installed, negotiate your way to the setting for the plug-in and enter your Google Map API code. All being well you will get a nice green ‘validation message’. If not, then you’re on your own.

5. As shown below, this basically adds an extra field to any new post or page where you just enter you specific address details.

6. Once you have done this, click ‘Send Map to Editor‘ and it will automatically insert the Google Map code into your text editor, as you can see below. The ‘Get Direction‘ feature appears automatically.



You now have a fully editable API Google map in your WordPress blog. Woop.

Other than a few tweaks to the size, there is not much else you can change. As I mentioned at the beginning, there are a number of API routes you can take, including Flash and HTML, so you may want to play with these other options opposed to a plug-in.


Categories: Web Development
Tagged: api, code, configure, google, google maps, maps, seaford head

< Previous: Logo Design RoundUp Part 14 – How Designers Promote & Brand Themselves
> Next: Typography Moustache Chart – What font is your tash?


Share:

Skip To Top? ↑