How to Add Bing Maps to Your WordPress Website

If you are looking for an alternative to Google Maps for any reason, Bing Maps is the obvious choice.

You may ask yourself what the difference is, and the answer is – not much. Both Bing and Google offer accurate and accurate maps. What more could you want? First, Bing offers a higher resolution, making Bing Maps better for navigating tight spots. This also means that it might be better for desktops where high resolution can really come into play.

Also, some people want to avoid Google wherever possible, and Microsoft’s answer to Google Maps represents the perfect solution, as it’s functionally very similar.

There are two easy ways to add Bing Maps to your WordPress website. One includes Bing’s own code generator, and the other includes a free plugin and a Bing account. We’ll show you both.

Lets start!

How to Add Bing Maps Using Embed Code

The first thing you need to do is go to: Bing Maps Find the website and the location you want.

Inside More menu find Embed map to command.

You will see a new tab that allows you to customize the map you want to embed.

We’ll leave all the options at their defaults, but suffice to say you have a few options here. you can change map size according to your desired size and aspect ratio (with a minimum of 250 and a maximum of 800px). You can also change Map type into staticmay load slightly faster than default draggable, which allows your visitors to zoom and pan. this Map Styles menu lets you switch between defaults path and from the air (photo) views. Finally, you can switch View Larger Map and get directions Links.

After doing that, click Generate your code button.

Copy the generated code and you are ready.

Next, we’ll show you how to embed this code in a post.

if you are using Gutenberg block editor, it is very simple. Open a post and click the + sign to select a block. select custom HTML block.

Then paste the generated code into your block.

And your map will appear in your post, it’s that easy!

If you are using Workman, the procedure is very same. Simply choose Custom HTML Select the widget from your left-hand menu, drag it wherever you want on the page and paste the code you got from Bing.

and with Classical The editor is even simpler, although you lose some of the WYSIWYG quality Elementor provides: text tab, then paste the code where you want it to appear on a post or page.

How to Add Bing Maps Using a Plugin

The above works great for a simple map. But let’s say you’re working from a number of different locations or want to add pins or shapes to create your own Bing map. You can do all this and more with a plugin. We’ll start you off with one of the more common – still a good all-round solution.

The plugin we will use is WP Bing Map Pro. You will need to install and activate it. If you’re not sure what a WordPress plugin is or how to install and activate a WordPress plugin, we have tutorials for that.

Following that, you need to create a Bing account to get an API key. To do this, visit bingmapsportal.com and Register.

Sign in with your Microsoft account data and Yes, let’s create a new account! You will be taken to the Create account form, which you must fill in with your data before clicking. Create button. After creating the account, navigate to: My Account/My Keys.

You will need to fill out a request form to generate a key. Once you’ve done that, you can generate a key by clicking it. Create button.

You can now copy from the table below.

Next, you need to configure the plugin. Use the left menu in your WordPress Dashboard to navigate. WP Bing Map Pro/WP Bing Map Pro.

The add-on will open on the Maps screen. But first we want to take a look at this. General Settings screen. You need to paste the copied key here. API KEY box and click Save.

Click + Click the button and name the map. we named our location. then click Save.

Now we have a shortcode for it our location. Copying this shortcode into a shortcode block will create a world map. So we need to narrow it down a bit. Say our location is near the 6th October Bridge in Cairo, Egypt. Clicking on the Edit button will start editing the map.

We will pan and zoom the map to find our location. You can use the search function on Bing’s website to do this for your location, or Map Center Latitude and Map Center Longitude commands. we feel zoom in 15 is suitable for us.

Here you can also change the map TitleDimensions (Width and Height), plus choose from six map types. Once done, we will Save ours Map. You can also copy the image of the map to your clipboard by clicking the icon. Capture Map View button.

If you want to pin your location on the map, you need to look at the Pins screen. Click + Sign button to add PIN.

Next, you need to edit your pin with a give. Pin Nameoptional Address (or define using its coordinates Latitude and Longitude), select or install Symbol for this and Save he is.

To see it on your map maps screen, then go to the edit screen. our location. there you will find Map Pins tab. To add a pin to a map, find the pin you want (centre in our case) and click Add symbol.

once you come back Map In the tab you will find your pin stuck on the map. Necessary Save your Map and copy the shortcode [ourlocation] for later use.

If you’re using the Gutenberg block editor and want to view your map as part of a post, you can create a new shortcode block By clicking the + sign and selecting a shortcode block. Paste [ourlocation] to his own field.

And now your map will be displayed as part of a post or page.

If you’re using another page editor, the procedure is pretty much the same as described above: for Elementor Short code Drag the widget from the left side menu to where you want it on your page or post and paste your map shortcode into the shortcode field.

If you are using the classic editor, set your input to text and paste the shortcode. WordPress does the rest for you.

As a result

As you can see, displaying a Bing map on your website is super easy and takes almost no time. If you’re looking for a simple map, you can embed it using code generated by Bing Maps. On the other hand, if you are looking for a complex solution for example for different cities, countries or even a number of locations around the world, you want to add pins, lines or shapes to make your map more informative for you. visitors, we recommend that you set up with a Bing account and a plugin like WP Bing Map Pro and use the customization functions – much mentioned in this article – to create a map or set of maps that suit your brand and website style. more.