Embed Map in Post/Page of Your WordPress Site by OSM – OpenStreetMap
Many of WordPress users are interested to show the map along with exact location and proper terminologies in their site. No doubt it looks impressive and make a clear view in your reader’s mind. So if you are interested to display your map on any of the page/posts of your WordPress site, then you are on the correct place here. I am going to provide you a solution for it, keep on reading further.
A plugin OSM (Open Street Map) , it is pronounced as ‘O’ ‘S’ ‘M’ but I pronounce it as “awesome”, as it is really a simple and an awesome plugin that helps you to locate your location through a map, which can even be customized from your end according to your requirement like border color, type of marker etc.
Some key features of this plugin are -
- embeds OpenStreetMap, OpenSeaMap and Google Maps maps to your posts/pages
- embeds external maps to your posts/pages
- visualizes several tracks / routs in different colours (gpx and kml)
- visualizes popup-html-markers (list in txt-file or single in the shortcode)
- visualize all geotagged posts of your blog in one map with/without a link to the post
- use custom field to add geolocation to your blog
- geo data are written to html-meta tags of your blog
- uses OpenLayers Library
- extends Mediathek rights to upload GPX files.
Now you may be eager to know how to use this plugin, so here is the link to download this plugin and use it, and enhance your site by making it more user friendly.
So here is the step by step guidelines to use this plugin, once you entered your dashboard.
Download OSM WordPress Plugin.
You can download OSM plugin directly from the WordPress.org repository or You can also check their official website
Step 1:
Install and activate OSM plugin as shown in the image below -
Step 2:
Once you activated this plugin, now you need to move to “Settings” menu and select “OSM” there, and finally here you can customize this plugin according to your required settings, as shown below -
Step 3:
Now you can set the marker details here, that will be displayed on the map through the marker that you have selected above.
Step 4:
You can also set border you would like around your map along with some controls like scaleline or mouse position etc as shown below -
Step 5 :
At this step, you will find a default map and then you need to scroll this map to point out your exact location and then copy the shortcode that is unique for that selected location.
Step 6:
Here you will see the shortcode that is been highlighted, that is to be copied and pasted on the post/page you want, as shown further.
Step 7:
Select the page/post from your dashboard, and either double click on it or open it through “edit” option.
Step 8:
Paste the code in the page where ever you want to display the map, update it and then view your post, as shown in the image below -
Step 9:
Your map is ready on your site, and that’s it.
Hope you found your solution here, let me know about your feedback and experience regarding this post via comments, they are always most welcome!!!













I think the admin of this web page is really working hard for his
web page, because here every material is quality based stuff.
Yes you are absolutely right and thanks for your positive comment.
I am curious to find out what blog system you have been working with?
I’m having some small security problems with my latest
blog and I would like to find something more safe. Do you have any solutions?
We are using WordPRess as our blogging system and it’s good with security and easy to maintain.