Geotagging, for real this time

Posted: January 23, 2010
Tagged: , ,

Some outdated info I didn’t want to just chuck

If, for some reason, you still want to use stinky old thickbox, here are all the hoops you need to jump through.

Getting really fancy

This is the one that gave me so much grief trying to figure out. It requires jquery and thickbox to work, and displays the map in a purty iframe. The problem was that the jquery stuff you add to a url to make it show in an iframe was confusing Google Maps, since their url has its own set of queries. So I’d get maps that wouldn’t be centered, or wouldn’t finish loading. Then (like seven months later), I learned you can use thickbox to display hidden content that’s already on your page. So I had my code write a hidden div, which had an iframe, which contained the actual map.

First, add a definition to the array:

'i' => 'mappyhide',   # default value if none entered in shortcode

This is in case you want to have more than one of these things on a page, but I wouldn’t do too many. Anyway, the shortcode would look like this:

[geo i="Sneedle" t="The Space Needle" n="47.620484" w="-122.349544" z="19"]

Then, edit the “do it” part:

return "Location: {$n}&deg; N, {$w}&deg; E (<a href=\"#TB_inline?width=800&height=600&inlineId={$i}\" class=\"thickbox\" title=\"{$t}\">Gmap!</a>)
	<div id=\"{$i}\" style=\"display:none;\">
		<div style=\"margin: 0; padding: 0; width: 100%; height: 100%;\">
			<iframe src=\"http://maps.google.com/maps?q={$n}+{$w}&ll={$n},{$w}&t=h&z={$z}&output=embed\"></iframe>
		</div>
	</div>";

Oh, just stop it

So, what if you want to make an inline link, like, with text?

function igeotag($atts) {
	extract(shortcode_atts(array(
		'i' => 'mappyhide',   # default value if none entered in shortcode
		'l' => 'linkytext',   # default value if none entered in shortcode
		'n' => '41.000',      # default value if none entered in shortcode
		'w' => '-93.000',     # default value if none entered in shortcode
		't' => 'Earth',       # default value if none entered in shortcode
		'z' => '16',          # default value if none entered in shortcode
	), $atts));

	# do it (no linebreaks or indents, to prevent unwanted whitespace on page)
	return "<a href=\"#TB_inline?width=800&height=600&inlineId={$i}\" class=\"thickbox\" title=\"{$t}\">{$l}<span id=\"{$i}\" style=\"display:none;\"><span style=\"display: inline-block; margin: 0; padding: 0; width: 100%; height: 100%;\"><iframe src=\"http://maps.google.com/maps?q={$n}+{$w}&ll={$n},{$w}&t=h&z={$z}&output=embed\"></iframe></span></span></a>";
}
add_shortcode('igeo', 'igeotag');

And the shortcode looks like this:

[igeo i="InlineSneedle" l="SWEET" t="The Space Needle is hella sweet" n="47.620484" w="-122.349544" z="19"]
Pages: 1 2