Embed Map in Post/Page of Your WordPress Site by OSM – OpenStreetMap

By Neha Yadav Our Bestseller: WordPress Themes

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 linkto 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 plugindirectly 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!!!

About Neha Yadav
subscriber

"I like to post the blogs related to real life and helpful for a successful life. You can gain more knowledge and share your issues with me on our website via comments"

Comments and Responses

Share on Google Plus

About Unknown