Recently I acquired tickets to go to Europe, that’s later this year, and I had a brief thought – I wonder if I could use WordPress for iPhone to make a travel blog. The intention was to be quick about it, i.e. take a photo, send it off, without thinking. Oh, and have it mark the location of where the photo was.

My search came to an end surprisingly quick, WordPress for iPhone already does geotagging, it’s just WordPress itself doesn’t take advantage of it yet. There is a way however, and I managed to get something going in no time.

When WordPress for iPhone geotags a post it adds several custom fields to the blog post, but we care about:

  • geo_public – indicates that the geotagging data is public,
  • geo_address – the address that was picked up,
  • geo_latitude and geo_longitude – the important bits.

If it’s your blog, it’s up to you whether you heed geo_public, but this is a good indicator for whether you have a geotagged blog post or not.

Google Maps provides a handy API to provide static images, no key required. The URL is http://maps.google.com/maps/api/staticmap? and then you bundle in a bunch of parameters:

  • sensor=false because we aren’t using a GPS to generate this map, at least, I think that’s the rule (cause we did)
  • maptype can be satellite, terrain, hybrid or left out for the default street map. I like the terrain maps.
  • size is the size you want the image to be, widthxheight.
  • zoom is your preferred zoom size,
  • markers in my example is size:small|lat,lon

And you have a nice Google Map! But in your WordPress blog template, find where you output your blog posts (my theme has this in a function) and do the following:

<?php if ( get_post_meta($post->ID, "geo_public", true) == "1" ) :
	$map = "http://maps.google.com/maps/api/staticmap?sensor=false&maptype=terrain&size=234x150&zoom=12&markers=size:small|";
	$lat = get_post_meta($post->ID, "geo_latitude", true);
	$lon = get_post_meta($post->ID, "geo_longitude", true);
	$map .= $lat . "," . $lon;
?>
<div class="post-map">
	<img src="<?php echo $map ?>" alt="Google Map" /><br />
	<?php echo get_post_meta($post->ID, "geo_address", true); ?>
</div>
<?php endif; ?>


Done!

Another thing of note, the WordPress app will resize photos down to 640×480 and I’ve found no way of changing it, so make sure your template is ready for it!

Plus, I haven’t decided if I would do it, mobile roaming charges are expensive, and I’d have better things to do than tell you all about it.

  • raananbarcohen
    Hey Daniel -- very cool.

    You may also want to check out the geolocation plugin that was put together by the same team that works on the WordPress for iPhone app: http://iphone.wordpress.org/2010/05/03/geolocation-plugin-wordpress/
  • Eep, I was going to mention it but forgot about it in my blogging haste. Cheers.

    I didn't like the way it would put a link at the end of the blog post, and it didn't work, so I commented the output hook. Makes things easier for managing the geotagging stuff on the post.
  • raananbarcohen
    ahh, gotcha.

    just fyi - you can edit in the settings where the map appears, including using a shortcode to place it yourself.

    And I know the developer is working on an update, so any bug reports, etc would be helpful to hear.
blog comments powered by Disqus