How to Embed Bing Maps in WordPress (Step by Step)

Do you want to embed Bing Maps in WordPress?

You can use Bing Maps to show directions, traffic, routes, and navigation instructions on your WordPress site. If you don’t want to use Google Maps, then Bing is a great alternative map application with a ton of useful data.

In this article, we will show you how to easily embed Bing Maps in WordPress, step-by-step.

Why Add Bing Maps in WordPress (And Not Google Maps)?

If you run a store, restaurant, salon, tourist attraction, or other physical business, then adding Bing Maps to your website will make it easier for customers to find you.

Potential customers can also get driving directions to your business and easily share your location with friends and family. Not only that but embedding Bings Maps can improve your WordPress SEO and make your site more visible in local searches.

When it comes to adding a map to WordPress, Google Maps may seem like the obvious choice, especially since they offer a Google Maps store locator.

However, in recent years Bing Maps has become more popular, and both services offer slightly different features, area coverage, and data. In particular, many people believe that Google Maps overestimates the time it takes to reach your destination.

If you are not happy with Google Maps or simply prefer Microsoft to Google, then Bing Maps is a great alternative.

With that being said, let’s see how you can add Bing Maps to your WordPress website. Simply use the quick links below to jump straight to the method you want to use:

Method 1: Adding Bing Maps in WordPress (Best For Single Maps)

Many business owners simply want to add a map to their contact form or About Us page. If you just want to add a single map to your website, then you can use an embed code.

Simply head over to Bing Maps and search for the location or map that you want to use. Once you’ve found the right location, click on the three-dots icon, and select ‘Embed a map.’

Bing will now open a new tab where you can customize the map by changing its size, map type (static or draggable map), map style (road or aerial), and more.

As you make changes, the preview will update automatically, so you can try different settings to see what looks the best.

When you are happy with how the map is set up, click on the ‘Generate Code’ button.

Bing Maps will then show a code snippet. Go ahead and copy the code, as you’ll need it in the next step.

Now, switch back to your WordPress site and open the post or page where you want to add the map.

Then, click on the ‘+’ icon and start typing ‘custom HTML.’

When the right block appears, just click to add it to the page.

Once you’ve done that, simply paste the embed code into the custom HTML block.

You can now click on either the ‘Update’ or ‘Publish’ button to make the map live on your online store or website.

Method 2: Adding Bing Maps Using a Plugin (Best For Embedding Multiple Maps)

If you only need to add one map, then the embed code is a good solution. However, this method can take a lot of time and effort if you need to add multiple Bing Maps.

For example, if you run a business directory, then you may need to add a map to every single page. In this case, we recommend using Ultimate Maps by Supsystic as it makes it easy to embed Bing maps, Leaflet maps, and other Google Maps alternatives.

The first thing you need to do is install and activate the Ultimate Maps by Supsystic plugin. For detailed instructions, see our step-by-step guide on how to install a WordPress plugin.

To use this plugin with Bing Maps, you’ll need a Bing Map API Key.

To get this key, simply create an account in the Bing Maps Dev Center. If you already have a Microsoft account, then you can sign in with your Microsoft login information.

After signing into your account, click on the ‘My Account’ menu.

Then, select ‘My Keys.’

On the next screen, you need to fill out your WordPress blog or website information.

Then, click on ‘Create.’

After a few moments, you’ll see the message ‘Key created successfully.’

You can now click on ‘Show key’ and copy the Bing Maps API key, or simply click on the ‘Copy key’ link.

The next step is pasting the key into the plugin settings.

In your WordPress dashboard, you need to go to Ultimate Maps by Supsystic » Settings. Then, open the ‘Maps Engine’ dropdown and choose ‘Bing Microsoft.’

You can now go ahead and paste the API key into the ‘Bing Maps API Key’ field.

With that done, don’t forget to click on the ‘Save’ button.

After that, you may want to add marker categories. Similar to categories and tags in WordPress, these can help organize the points of interest on your map.

For example, if you are creating a map for tourists, then you might create categories such as ‘Accommodation,’ ‘Restaurants,’ and ‘Attractions.’

To create a category, just select the ‘Marker Categories’ tab and then click on ‘Add Category.’

You can now add a title, change the background and text color, and assign child categories to parent categories.

When you are happy with the information you’ve entered, click on ‘Save.’

To create more categories, simply click on the ‘Add Category’ button.

With that done, click on the ‘Add Map’ tab. You can now type in a name for the map, define its width and height, choose a navigation bar mode, and more.

You can also configure options to make the Bing Map draggable, use double click to zoom, and more.

Most important of all, in ‘Map Center’, type in the location you want to show. You can either type in the address or the longitude and latitude values.

There are lots of settings on this page, so it’s worth looking through all the options and making any necessary changes.

When you are happy with how the map is set up, just click on ‘Save Map.’

After that, you may want to highlight one or more locations on the map using markers.

To start, click on the Markers tab and then type in a name for the marker. Typically, you’ll want to use the name of the place or organization, but you can type in any name you want.

After that, you can add text and images to the marker description. You can also choose an icon for the marker.

With that done, you need to enter an address for the marker and select a marker category.

When you are happy with how everything is set up, click on ‘Save Marker.’

To add more markers, simply follow the same process described above.

As you add markers, the map preview will update automatically.

When you’ve finished customizing the map, copy the shortcode next to ‘Map shortcode.’

If you don’t see a shortcode, then make sure you’ve saved the map.

You can now open the page or post where you want to embed the Bing Map. Simply click on the ‘Add New Block ‘+’ icon and type in ‘Shortcode.’

When the right block shows up, click to add it to the page.

Now, simply paste the Bing Map shortcode into the block.

To make the map live, either click on the ‘Update’ or ‘Publish’ button. Now if you visit your website, you’ll see the Bing Map in action.

We hope this article helped you to learn how to embed Bing Maps in WordPress easily. You may also want to see our guide on how to create a WooCommerce popup to increase sales or our expert pick of the best live chat software for small businesses.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.