Recently I built a small personal photo blog for myself. Since one of my biggest passions is traveling I wanted to share good photos from my trips on the blog. I also wanted to feature a prominent travel map on the blog, which would list all the locations I have visited and link to the blog posts about them. Should be no problem I thought. I just need the right plugin.
Naturally I started my search for a good plugin I could use to create a travel map in the official WP plugin directory. Like I expected there are plenty of maps and mapping plugins for WordPress already in there. Most of them however use the Google Maps API, something I did not want for my site since the maps are not customizable enough and in my opinion do not look good.
Luckily there is also the Google Geocharts API, which provides a great alternative. It is meant to create map charts and provides enough settings to customize all colors and most other parameters of the resulting maps. There are much fewer WordPress plugins available that use the Geocharts API however and all of the required location markers for the map to be added to a list manually. I planned to have hundreds of places on my map eventually, so that is too time consuming. I needed something that could list all my posts on a map automatically.
The solution was simple of course: I created my own travel map plugin.
Introducing My Simple Travel Map Plugin
Using bits from existing plugins it just took a few days to piece together a basic travel map plugin for WordPress. The result: You can now see my travel map in action on my personal site.
After completion of my own site it I brushed the plugin up a little more, added a basic settings page and then released it in the WordPress plugin repository under the creative name “Simple Travel Map”.
That means if you want to create a similar travel map for your own blog you can download my plugin and follow the instructions below. But first a quick look at what the plugin can actually do:
- Create a travel map with a nice design, using the free Google Geocharts API.
- A marker can be placed on the map for each of your posts or pages. A custom field is used to set the location of the post on the map.
- Each marker on your travel map links to the post when clicking on it.
- Hovering over a marker opens a popup showing the name and thumbnail image of the post.
- You can display your travel map in any post or page through a WordPress shortcode.
- The settings page allows you to quickly modify all colors to make the map blend in with your WordPress theme.
The “Simple” in the name of my plugin is meant as a warning as well. Because I built the plugin for my own purpose it really only does one thing: List posts on a pretty world map. It supports no other maps or regions or other ways to input markers. Keep that in mind when you use it or consider one of the alternative map plugins I have listed below!
How To Use My Simple Travel Map Plugin
1. Installation: Works just like with any plugin hosted in the WP plugin directory. Go to “Plugins > Add New” in your WordPress admin and then search for “simple travel map”. Click “Install” next to the first result and afterwards press “Activate”.
2. Add Locations To Posts: The travel map plugin marks locations on the map based on a custom field found in your posts or pages. That means for each location you want to show you need to add such custom field to the post the location is meant to represent.
To add a custom field manually go to the “All Posts” page in WordPress, click “Edit” next to the post of your choice to get to the WP post editor. Scroll down and find the box titled “Custom Fields”. Then:
- Locate the “Add New Custom Field” box.
- Press “Enter New”
- Enter “location” without quotes as the name.
- Enter your desired location as the value, e.g. “Paris, France” or “Barcelona”. Any city or country works.
- Press the “Add Custom Field” button.
After doing this the first time the “location” field will be saved and you can simply select it from the dropdown instead of pressing “Enter New” for future posts.
For my own travel map I have used a more automated approach and generated both the custom fields and posts while uploading my photos. You can read more about my process of creating a photo blog semi-automatically in this separate post.
Note: If you can not find the “Custom Fields” box at all click on “Screen Options” at the top right of your editor. In the box that slides down set a checkmark next to “Custom Fields” and it will show up immediately (scroll down again).
3. Travel Map Settings: Go to “Settings > Simple Travel Map”. All you need to do here for now is press the “Index Post Locations” button.
This will check the meta value for all your posts and calculate the exact coordinates of the locations you set. We do so because locations by coordinates are much faster to display on the Geocharts map. Without them each of your locations would load one by one.
Once done you get results of all locations. If there was a problem, e.g. because a location could not be transformed into its coordinates value you get shown the post ID that happened for.
Further down you can use the settings to customize the color of your travel map or specify a fixed width.
4. Place Your Map Somewhere: This one is easy. Simply open a post or page of your choice in the WordPress editor (by going to “All Posts” > “Edit”) or start creating a new one. To display your travel map place
[simple-travel-map] in the content anywhere. This shortcode will get replaced with the map when viewing the post.
After saving the post click to view it and you can see your new travel map!
Some Good Alternative WordPress Travel Map Plugins
I warned you above: My plugin is really “simple” and will not be right for every purpose. If you know how to code you might be able to customize it to do what you want. If not I present you some of the best plugins to create a travel map with WordPress below, which I found during my initial research:
What it does: Despite its rather bad rating this is a very promising plugins with lots of settings. It supports both the Google Geocharts API and the Maps API, can display multiple travel maps and much more. It also does not require manual input since it uses your existing taxonomy names to populate the travel map.
Why it was not for me: Even though it is called “Map My Posts” it does actually map categories or tags. That means you get a marker for each of your categories and clicking on the marker brings you to the category page. Since I really wanted to “map posts” I needed to look elsewhere.
What it does: This is the only plugin discussed in the post which can show routes on a travel map. It connects any locations you input and displays them on a zoomable Google map in your WP blog. You can see a good example here.
Why it was not for me: It uses the Google Maps API and requires manual input for each stop of your route. There is also only support for 1 travel route per map right now.
What it does: Create maps with the Google Geochart API, all kinds of them actually. This plugin is not specifically meant for travel maps and thus has lots of settings to create all different kinds of geocharts. From my research it seems to be the most comprehensive geochart plugin available for WordPress. Please note though that it is premium only and because of that I did not test it.
Why it was not for me: As with many of the maps plugins all locations need to be entered into a list in the plugin settings one by one, which is not something I wanted to do for 200+ posts.
I hope this post was useful and helped you create your own map of places you have visited. If you have problems with using my travel map plugin feel free to let me know in the comments and I will try to help!
Did you use my WordPress travel map plugin? Feel free to share the map you created in the comments below!