Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

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.

How to embed Bing Maps in WordPress

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.

An example of an embedded Bing map

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 navigate through the steps:

Step 1: Install a Bing Map Plugin and Get Your API Key

Previously, you can embed a Bing map by generating an embed code from the platform. However, when we tried that method, it no longer works.

For that reason, now the easiest way to embed your Bing map on WordPress is using Ultimate Maps by Supsystic. This plugin makes it easy to embed Bing maps, Leaflet maps, and other Google Maps alternatives.

Plus, it’s also a good option if you run a business directory, where you may need to add a map to every single page.

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.

Sign in to Bing Dev Center

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

Then, select ‘My Keys.’

Bing Maps Dev Center My keys Option

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

Then, click on ‘Create.’

Create Bing Map API key to Embed in WordPress

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.

Bing Maps API Key Created

Step 2: Paste the API Key and Create Marker Categories

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.’

How to add a Bing Map to your WordPress website

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.

Adding a Bing Map API key to your WordPress website

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.’

Adding marker categories in WordPress

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.’

Adding Bing marker categories to a WordPress website

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

Step 3: Customize Your Bing Map

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.

Add Bing map using a plugin

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.

Choosing a location for a Bing map

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.’

Saving a custom Bing 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.

Add new Marker for Bing Map in WordPress

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.

Adding markers to a Bing map in WordPress

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.

Save Marker for Bing Maps

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

Step 4: Embed the Bing Map on Your WordPress Site

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

Copy Bing Map Shortcode to embed in WordPress

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.’

Adding a shortcode in WordPress

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

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

Paste BIng Map Embed Shortcode in WordPress Page Editor

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.

Learn More Ways to Embed Elements on WordPress

Do you want to embed other elements on your WordPress website besides a Bing map? Check out the articles below:

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.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. See how WPBeginner is funded, why it matters, and how you can support us. Here's our editorial process.

Editorial Staff

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

The Ultimate WordPress Toolkit

Get FREE access to our toolkit - a collection of WordPress related products and resources that every professional should have!

Reader Interactions

6 CommentsLeave a Reply

  1. Jiří Vaněk

    Thanks for the practical guide. So far I only had experience with google maps. I will definitely try to integrate BING maps as well, in order to test their functions and possibly also the loading speed.

  2. Jiří Vaněk

    Thanks for the tip, I actually never thought of using maps other than Google. But I’m all about speed. Google Maps slows down page loading a lot. Are Bing and Microsoft better off?

    • WPBeginner Support

      The maps would require a similar amount of load time at the moment.

      Admin

  3. GODZILLA491

    I don’t know why but it doesn’t work.
    I found your tutorial after several minutes spent doing the same things you do but all i had is a blank post.

    With google it works, but i need to use bing maps.

  4. Anita

    how do I find a video on adding google maps

Leave A Reply

Thanks for choosing to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and your email address will NOT be published. Please Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.