Location, location, location. One of the components we have experimented with quite extensively over the last decade is GOOGLE MAPS. In fact, we should release a plugin at some stage called GOOGLE MAP IT.


Fact is, location as a navigation tool is a very difficult to replicate in any other user friendly format as far as NAVI goes. It is so simplified.

Where are you ? What are you looking for ? What is the closest ? Alternatives by distance ?

2 + 2 = 4

Google MAPS API

As you may well imagine the full process of geocoding data as well as the format in which we display the data is powered by GOOGLE API.

To give you a little background of how long we have been messing with this API I went looking for an old video on YOUTUBE.

Ah, the good old days eh.

Things have moved on a bit from then however. Let me explain the LOCATION TAB in the process from SUBMIT to DISPLAY.

Geocode This

When a new listing is added (single post created – regardless post type) the submission process we use takes the address and geocode that location.

In areas where the geocoding form an address field is not returning an accurate location, we have also embedded an interactive map with a drag and drop function to allow you to DRAG and PLACE the pin correctly.

A third module allows for mobile GEOCODE MY CURRENT LOCATION functionality.

So, obviously – on submission we deal with the geocoding process ON SUBMISSION and then store our OWN latitude longitude coordinates in every single post. This negates the requirement to ask GOOGLE to geocode on every page load. Also quite simple to display multi pin maps.

Geocode On Submission

The screengrab below :

Geocode Location Tab

LIVE LINK HERE

As you can notice, and test on the LINK above, this is the SUBMISSION process.

When the post is created the CUSTOM FIELDS auto complete to add the lat / long details.

Screengrab below:

LAT LONG location TAB custom fields

The Location Tab

The front end that the user sees looks like the screen grab below. The second grab is when you click to open the INFOBOX ***

Google Maps Tab - Plugin Addon

Maps Add On Tab - Google Maps

LIVE LINK HERE

The backend of the tab was created by making a new OBJECT – screengrab below

Object Plugin - Google Maps Tab

Second step of course is to add it to the WORDPRESS TABS PLUGIN admin panel, using shortcode again. Screengrab below.

Shortcode to TAB - power sites wordpress

*** REF : INFOBOX

To make the map popup somewhat dynamic there is a custom add on to define INFOBOXES. Still not completed, little reference and current screen grab.

Infobox Screen Garb