Static Google maps for Jekyll

As of 7/26/2014, this site has moved to the Mapbox static API.

I have several posts with locations and I wanted a better way to integrate them into my posts. I tinkered around with the static Google Maps Image API and found a neat little solution.

Code

Explanation

For any post with a location, I add a “locations” variable in the post header.

locations:
  - University at Albany
  - Siena College

I’m using locations to support more than one place, but you can have just one.

locations: Albany,NY

Your location can be a place, a city, an address, or even coordinates. Really anything you would enter into Google Maps search.

Live Example

Zoom for more than one locations

When using more than one location, the map will center around the first location. So it would be wise to put your most centrally located destination first. You might also need to change the zoom on the map. You can do this by adding a “zoom” variable in the post header.

locations:

- University at Albany
- Siena College
  zoom: 10

The lower the zoom, the farther out the map will reach. The zoom is automatically set at 13, which is ideal for 1 location (but you can adjust that in the code).

More Information

Take a look at the Google Maps Image API for more parameters. You can learn how to adjust the size of the image, styling markers, and much more.