Why do you need a map on your site?

Just imagine the following instances where a map would add value to your website. You run a beautiful holiday home in the countryside; just a short drive from a bustling city. It’s a little into the forest will less phone connectivity! How would visitors reach your holiday home? Having the location marked out on a map on your website ensures that people reach your place will less hassles and are ready for a quiet vacation. Or you could be running a business where it’s vital for people to know how to reach your office with ease. Or you could just be having a travel blog and you want to show your readers where you have been travelling. In fact maps are a good to add feature for any kind of website, be it a business or leisure blog! Let us see some of the ways to add a map to your WordPress site.

Embedding a map to your site manually

It is fairly simple to manually embed a Google map to your website. Visit maps.google.com to open Google maps. Click on the region you want to focus on or type it on the text box to get a region of the map of your interest. Next click on the gear shaped icon on the bottom right corner of the map and select the option – “Share or embed map”.

Share or embed the map

You will then get the following window which provides the html code to embed the map on your site. You can select the size of the map to be embedded as Small, Medium, Large or Custom size.

Embed map tab selected

This html code can be used anywhere on your WordPress site to embed the map. You can embed it on a page, post or a widget. All you have to do is simply paste the code on the text portion of a page, post or widget. Here is an example of adding the map to a text widget. To add to a text widget, go to the WordPress dashboard, select the Appearances menu and add a new text widget. You can provide a title and copy the code onto the text box and save.

Adding the map to a text widget

Now your website has the map on the sidebar as below.

map_widget

This looks good, but you can further enhance your site by adding a custom map. For instance a travel blog would look good with a map having markers for all the places visited. You can even highlight a route. Let us see how we can add a custom map next.

Embed a custom map

Open maps.google.com and click on “My maps” option below the search box.

creating_maps

Next choose the option to “Create a new map”.

create_new_map

You will then get a map which can be customized as per your needs.

new_map

You can add markers by selecting the balloon icon. Add the markers you want and save the map. Click on the “Share” button to make this map’s settings Public. Only by doing this, you can embed the map onto your site.

sharing_map

Next you can click on the 3 dots near the “Share” button and select “Embed on my site” option. You will get the html code to copy and paste onto your website as described above.

embed_map

This can be pasted to a page, post or a widget. On adding it to the same text widget described above, the map looks like this now! The markers highlight the cities visited by the author of the travel blog.

map_widget

We just discussed embedding a map manually on your website. There are simpler methods to add a map to your WordPress site by installing some plugins. There are WordPress plugins like Google maps widget which allows you to add a Google map as a widget to your website or anywhere else with a short code, WP Google maps plugin which allows you to add a map and also customisation of the map. Apart from these 2 plugins mentioned, there are a host of other plugins that support adding a map.

 

close

Download Now:
Top 11 Secrets of an Awesome WordPress Backup Plugin

Download the guide now