| 1 |
Leaflet Map WordPress Plugin |
| 2 |
======== |
| 3 |
|
| 4 |
 |
| 5 |
 |
| 6 |
|
| 7 |
 |
| 8 |
|
| 9 |
Add a map generated with [](http://leafletjs.com/LeafletJS](http://leafletjs.com/](http://leafletjs.com/): an open-source JavaScript library for mobile-friendly interactive maps. Map tiles are provided by default through [](http://www.openstreetmap.org/OpenStreetMap](http://www.openstreetmap.org/](http://www.openstreetmap.org/), or [](https://www.mapquest.ca/MapQuest](https://www.mapquest.ca/](https://www.mapquest.ca/) (with an app key). Can be set per map with shortcode attributes or through the dashboard settings. |
| 10 |
|
| 11 |
 |
| 12 |
|
| 13 |
Installation |
| 14 |
------------ |
| 15 |
|
| 16 |
* (simple) Install via the WordPress plugins page on your WordPress site: `/wp-admin/plugin-install.php` (search Leaflet) |
| 17 |
|
| 18 |
* (needlessly complicated) Copy this repo (or download a release of it) into your WordPress plugins directory: `/wp-content/plugins/`. You might also need to name the directory 'leaflet-map', like so: `git clone https://github.com/bozdoz/wp-plugin-leaflet-map.git leaflet-map` |
| 19 |
|
| 20 |
|
| 21 |
Available Shortcodes |
| 22 |
-------------------- |
| 23 |
|
| 24 |
### [leaflet-map] |
| 25 |
|
| 26 |
 |
| 27 |
|
| 28 |
Height, width, latitude, longitude and zoom are the basic attributes: |
| 29 |
|
| 30 |
``` |
| 31 |
[leaflet-map height=250 width=250 lat=44.67 lng=-63.61 zoom=5] |
| 32 |
``` |
| 33 |
|
| 34 |
However, you can also just give it an address, and Google will look it up for you: |
| 35 |
|
| 36 |
``` |
| 37 |
[leaflet-map address="Oslo, Norway"] |
| 38 |
``` |
| 39 |
|
| 40 |
The default URL requires attribution by its terms of use. If you want to change the URL, you may define a new attribution, or remove the attribution. You can define this site-wide in the admin, or you can set this per map in the shortcode (0 for disabled): |
| 41 |
|
| 42 |
``` |
| 43 |
[leaflet-map attribution=0] |
| 44 |
``` |
| 45 |
|
| 46 |
OR |
| 47 |
|
| 48 |
``` |
| 49 |
[leaflet-map attribution="Copyright @bozdoz"] |
| 50 |
``` |
| 51 |
|
| 52 |
The zoom buttons can be large and annoying. Enable or disable per map in shortcode: |
| 53 |
|
| 54 |
``` |
| 55 |
[leaflet-map zoomcontrol="0"] |
| 56 |
``` |
| 57 |
|
| 58 |
Alternatively, you could use a plain image for visitors to zoom and pan around with `[leaflet-image source="path/to/image/file.jpg"]`. |
| 59 |
|
| 60 |
### [leaflet-marker] |
| 61 |
|
| 62 |
 |
| 63 |
|
| 64 |
Add a marker to any map by adding `[leaflet-marker]` after any `[leaflet-map]` shortcode. You can adjust the lat/lng in the same way, as well as some other basic functionality (popup message, draggable, visible on load). Also, if you want to add a link to a marker popup, use `[leaflet-marker]Message here: click here[/leaflet-marker]` and add a link like you normally would with the WordPress editor. |
| 65 |
|
| 66 |
|
| 67 |
### [leaflet-line] |
| 68 |
|
| 69 |
 |
| 70 |
|
| 71 |
Add a line to the map by adding `[leaflet-line]`. You can specify the postions with a list separated by semi-colon `;` or bar `|` using lat/lng: `[leaflet-line latlngs="41, 29; 44, 18"]` or addresses: `[leaflet-line addresses="Istanbul; Sarajevo"]`, or x/y coordinates for image maps. |
| 72 |
|
| 73 |
### [leaflet-geojson] |
| 74 |
|
| 75 |
[](https://gist.github.com/bozdoz/064a7101b95a324e8852fe9381ab9a18](https://gist.github.com/bozdoz/064a7101b95a324e8852fe9381ab9a18](https://gist.github.com/bozdoz/064a7101b95a324e8852fe9381ab9a18) |
| 76 |
|
| 77 |
Or you can add a geojson shape via a url: |
| 78 |
|
| 79 |
``` |
| 80 |
[leaflet-geojson src="https://rawgit.com/bozdoz/567817310f102d169510d94306e4f464/raw/2fdb48dafafd4c8304ff051f49d9de03afb1718b/map.geojson"] |
| 81 |
``` |
| 82 |
|
| 83 |
Check it out [](https://gist.github.com/bozdoz/064a7101b95a324e8852fe9381ab9a18here](https://gist.github.com/bozdoz/064a7101b95a324e8852fe9381ab9a18](https://gist.github.com/bozdoz/064a7101b95a324e8852fe9381ab9a18). |
| 84 |
|
| 85 |
### [leaflet-kml] |
| 86 |
|
| 87 |
Same idea as geojson (above), but takes KML files and loads [](https://github.com/mapbox/togeojsonMapbox's togeojson library](https://github.com/mapbox/togeojson](https://github.com/mapbox/togeojson) |
| 88 |
|
| 89 |
Contributing |
| 90 |
------------- |
| 91 |
|
| 92 |
[](https://github.com/bozdoz/wp-plugin-leaflet-map/blob/master/CONTRIBUTING.mdView Contribution guidelines](https://github.com/bozdoz/wp-plugin-leaflet-map/blob/master/CONTRIBUTING.md](https://github.com/bozdoz/wp-plugin-leaflet-map/blob/master/CONTRIBUTING.md) |
| 93 |
|
| 94 |
Wish List |
| 95 |
--------- |
| 96 |
|
| 97 |
* A map editor/shortcode generator (so users can see what they're adding to the page) |
| 98 |
* Make the plugin extendable (add hooks/filters/actions) |
