Google map that opens in a new window

by

So, the issue is that if you use a google custom embed code, then the iframe sucks up all the clicks, so you can’t trigger a link.

The solution I’ve found is to use Google Static Maps which I discovered via Simple Static Googlemaps Plugin.

My priority is an attractive map which loads faster (requires no javascript) until the user clicks to navigate the map, then I want it to pop up in a lightbox (I use wp-fancybox). The plugin above may still function for WP v.3+ cos it looks pretty simple, but I didn’t try.

Instead I’ve embedded the following into my template:

$static_map = '
<img alt="Googlemap" src="http://maps.google.com/maps/api/staticmap?center=". $location
."&markers=small|' . $location
.'&zoom=14'
.'&size=480x340'
.'&sensor=false"/>';

$popup_map = '
http://maps.google.com.au/maps?q='. $location
.'&f=q&hl=en&geocode=&mrt=all&ie=UTF8&hq=&'
.'hnear=" . $location 
."&z=14&iwloc=&output=embed';

$map = '
<div class="map clearfix">
    <a class="iframe" href="'. $popup_map . '">
    ' . $static_map . '
    </a>                
</div>' ."\n";

print($map);
  • $location is just an address, nothing fancy (10 Monkey St, Jungletown, Madagascar)
  • in $popup_map leaving &iwloc= blank hides the text bubble
    i haven’t fiddled too much with other params ‘cos it seems to work 😉

Hope that helps! (Plenty of room for improvement)
Cheers, Tim

Leave a Comment