How To Add Bing Maps To A WordPress Blog?

There are many scenarios where we would like to add maps to our WordPress posts or pages. This depends on the type of blog and the niche we are working on. For a company blog, maps would be for the purpose of sharing their multiple business locations on the contact page. Likewise, if our blog is about the best restaurants or saloons in a locality, then providing the location of each one of them via maps is essential.

I have often seen travel related blogs sharing location via words rather than maps. Including a map to share the location details would dramatically improve the user experience. Bing maps owned by Microsoft are a popular option just like Google maps. In this blog, I will discuss two different methods to add Bing maps to WordPress.

Method1: Add Manually Without a Plugin

Step1: Go to Bing maps in our browser and select the location we want to share via map and click the share link the left pane of the maps as shown below.

Step2: A new screen will appear with the embed option. Click the embed link on the screen and a new page with options to customize the map will appear. We have options to select the size of the map, styles and well as map types (static or draggable maps).

Step3: After selecting the customized options, we can click the generate code button at the bottom part of the left pane. The code to embed Bing map will be displayed on the screen. Just copy this code.

Step4: Go to the post edit/create section in the WordPress dashboard and switch to text view by clicking the text link on the top right portion of the editor. Paste the code that we have already copied to the editor section and then publish or update the post.

Step5: We can see the post with the embedded Bing map as shown below.

This above method of adding Bing maps is quick and does not require any registration key from Bing. But if we are using maps frequently in our website as in the case of a travel blog then it is better to go with the following method of getting a key from Bing and using this key via a plugin for our maps.

Method2: Add Using a Plugin

Step1: Go to Bing maps portal and sign in using outlook account. If we do not have outlook account just sign up for one. It is completely free. Once signed in create an account for Bing maps by entering the details as shown below

Once the account is created go to the accounts section and we will see an option to create a new key.

Step2: Fill in the required details in the form by providing an application name, key type as basic and application type as a public website. Then click the create button and key is generated as shown below.

Step3: Go to the WordPress admin dashboard and install the Leaflet Maps Marker plugin.

Step4: Once the map marker plugin is installed and activated go to the settings section of the plugin. In the settings panel, go to Basemaps section as shown below. In the base map section, we can see the Bing maps option.

Step5: In the Bing section there is a textbox to enter Bing maps API key. Just copy the key that we have created before in the Bing portal and paste it into this text box. Click save changes button at the bottom.

Step6: Go to default base map for new markers/layers section. Select Bing maps (Road) as the default base map option and save the changes.

Step7: The last part of the settings is creating a new marker which is basically the map of a location. For this go to add new marker option on the plugin settings.

Here provide an identifiable name for the marker and select the location by typing the name of the place in the location text box. The name is just for us to identify the different maps that we are creating using this plugin and hence is not of much importance.

As in the case of Bing maps in the browser, suggestions for locations will appear below the textbox. Select the location we want to include and click the publish button.

Step8: A shortcode like [mapsmarker marker=”3″] will appear on the screen. Just copy this and include it in the post or page where we want to add Bing map and publish/update the post.

Now we can see the post with the embedded Bing map.

So from now on start adding maps to posts and pages and turn the dull text descriptions of locations to a visually appealing one.