1.0.2 • Published 2 years ago
eleventy-plugin-googlestaticmaps v1.0.2
Eleventy Plugin - Google Static Maps
This simple plugin adds an Eleventy shortcode for Google Static Maps. This service lets you add simple Google Maps images to your site without needing a JavaScript client in order to render it.
The maps are static (hence the name) but perfect for adding simple maps to your site.
Installation:
First, install the plugin:
npm i eleventy-plugin-googlestaticmaps
Then add it to your .eleventy.js
:
const mapPlugin = require('eleventy-plugin-googlestaticmap');
Then to use it, get your key from Google's console and pass it to the plugin:
const GOOGLE_MAPS_KEY = process.env.GOOGLE_MAPS_KEY;
module.exports = function(eleventyConfig) {
eleventyConfig.addPlugin(mapPlugin, {
key:GOOGLE_MAPS_KEY
});
};
Usage
The shortcode staticmap
is now available in your templates. The arguments are:
Argument | Required | Default |
---|---|---|
address | true | |
width | false | 500 |
height | false | 500 |
zoom | false | 13 |
maptype | false | "roadmap" |
Examples:
<img src="{% staticmap "lafayette, la" %}">
<p>
<img src="{% staticmap "bellingham, wa" 900 900 %}" width="900" height="900">
</p>
<p>
<img src="{% staticmap "moscow" 400 400 13 "satellite" %}">
</p>