Blog

How to Add Google Maps with WordPress Block Editor[2 Ways]

How-To-Add-Google-Maps-With-wordpress

Table ofContents

Do you want to know how to add Google Maps with WordPress block editor?

Adding a Google map to a local business website can help customers locate your business easily. This can boost your site’s visibility in the search engine and your business at the same time.

In this guide, I will show you the easiest ways to integrate Google Maps seamlessly into your business website.

I will show you how you can do it without a plugin and with a plugin so that you can compare which one best fits your needs.

How to Add Google Maps with WordPress Block Editor (Without a Plugin)

Let’s say, you want to skip the plugins because of all the hassle of installing and customizing them. Lucky for you, there’s another easy way to embed Google Maps to WordPress Block Editor without needing additional plugins. Here’s how:

Collect Embed Code from Google Maps

First things first, head over to Google Maps and locate the location you want to add to your website.

GCb4GLj80HkM3TSZGoYPC8SZ3yX Blend69Q9TPikM6kRy206b8TprudVKAaMwKfq4oeOnyzP30uxrjYYLauC6NK4ksawWbIiAhm1Bv3 N 2HD5sOexEjg1 TElZTw - BdThemes

Once you’ve got the perfect spot, click on the share button, not for sending postcards, but for collecting embed codes. So, click on ‘Embed a map’ tab, and you’ll see a code snippet waiting for you.

T TLmhB7ybMnrNBZRzh1LFq7a9cE41WsHX3hZjaElV6Tqx 0 YfUlygFEiZQN3cnMte zerDKVIpYx42etjzwSXsAIAK1ISHqz0WfdZ7DTwIqDZW HU8 - BdThemes

Click on the Copy HTML button and you’re good to go.

Embed the Map into WordPress Block Editor

Now, let’s put this code into your WordPress page. Visit the WordPress dashboard, find the page to add the map, and click “Edit” to open the Gutenberg block editor.

Add a new ‘Custom HTML’ block. 

726yrQBiEWNVPvRFPzPcEoYP3 nDvCsK ND3KSfxWCtsfK7cKJbaNtEbGoRAVAEhXnzF5ajbW1myxZaatSU29sRPylBg fgEEvNJS5cfPX0Kr2qa7w2egi4WbSVoeqmG6IkDZQRZeQMC0Gif2 2WhGk - BdThemes

Paste the HTML code you copied from Google Maps into this block, and voila, you’ve added your business’s location to your website.

JcpI vGrGfuLLw Won53QF2Tf3UPCao4x4OUjzdeTTTsJyV6GnzljoFshwgmdA4EZQHluqCASbNxzh6XAy1azWNvyx28PIrT8aVfiQuqgqWShsxDalr6NKvdVjLWmWYjyh YkRo0MBgXAZ 3Dk5tnaY - BdThemes

Hit preview to see the map seamlessly integrated into your webpage. 

PjG57HuVms2oDCnoZ39CYC Msoha - BdThemes

No plugins, no hassle.

Alternatively, you can use the “Google Maps” block, use a Google Maps API, and integrate a map, too.

NvS9Ym5uF7L86Ga2jsQbfshrss2zNPvTc 98 4KonLVeF7dmsza0mYi3H3Rp AC0GcFiRtG1pqpCz gBOc6G6 zd YCN78GIOejRphI0oStMRh2tJXkEc9SgMMcuarJ9yKQtzE2gUkF1C plJB5Rd4 - BdThemes

How to Add Google Maps with WordPress Block Editor (With a Plugin)

Now, if you’re leaning towards the efficiency and versatility of plugins, I’ve got you covered there too. 

Choosing the plugin route is like upgrading from a paper map to a GPS system. It’s efficient and powerful and gives you more control over the customization options.

Install and Use a Google Maps Plugin

WordPress plugins are awesome, there’s no doubt about that. They can transform complex tasks into a matter of a few clicks. 

But which plugin should you use to add Google Maps to your WordPress website?

Well, you can consider popular plugins like, “WP Go Maps” or “Getwid – Gutenberg Blocks.” These plugins offer simple Google Maps integration.

In your WordPress dashboard, navigate to “Plugins” and click “Add New Plugin.” Type the name of your chosen plugin into the search bar. Once it appears, hit “Install Now” and “Activate.” 

- BdThemes

Different plugins work differently, so read the documentation for the plugin you installed to learn how to use it.

Any plugin you use will require you to create a Google Maps API Key. Once you have yours, you can head to the plugin settings, locate the API key section, and input the API key.

Then, you can return to the Gutenberg Block Editor and create a new page or post or edit an existing one.

If you use the “Getwid” plugin, you’ll get a ‘Google Maps’ block to insert into your page and add your map.

You can then set the location, adjust the zoom level, and explore the plugin’s additional features.

When you’re done, click “Preview” to see if everything works perfectly. Once satisfied, hit publish.

Benefits of Adding Google Maps to WordPress

Now that you know how to integrate Google Maps in WordPress, let’s explore why adding a Google map to your website can be a game-changer for your business.

Makes Your Website More User-Friendly

User-friendliness is one of the most vital elements for better search engine rankings for any website. By adding Google Maps, you’re transforming your website into navigable terrain. Your potential customers can seamlessly locate your physical presence, enhancing their overall experience.

Helps with Local SEO

In the intricate world of SEO, local visibility is key. According to BrightLocal, 98% of consumers use Google to get information about local businesses.

Google Maps integration can act as a beacon, signaling your business’s precise location to search engines. This improves your local SEO ranking and ensures that your website appears on the digital map for relevant searches.

Makes It Easy For The Users To Find You

Picture this: A potential customer lands on your website and wants to visit your store or office. With an embedded Google Map, they can instantly see your location, making the journey from online to your doorstep effortless. It’s the digital version of putting up clear signposts.

Enhances Credibility & Engagement Of Your Website

Trust is the currency of the online realm. Adding Google Maps adds a layer of credibility to your website and engages users on a personal level. The interactive nature of the map creates a connection, establishing your site as a reliable destination.

Final Words

Congratulations! Now you know how to add Google Maps with WordPress block editor.

In the ever-evolving world of web design and user experience, the addition of Google Maps is a testament to your commitment to providing a seamless, informative, and engaging user experience for your visitors. 

Adding a Google Map can definitely bring more customers for your business so don’t miss out on it.

Share this post to your social media

advanced divider
Picture of AR Rakib
AR Rakib

Leave a Reply

Over 300,000+ Readers
Get fresh content from Bdthemes
Subscribe tonewsletter

Get Tips & Tricks, Updates, Fresh Blogs & Offers.

No spam messages. Only high-quality information that you deserve.

Explore OurProduct

Table of Contents

Take advantage of fine-tuned plugins

Get Customizable Elementor Widgets to Power Up Your Website

Take advantage of fine-tuned plugins to speed up web projects without sacrificing quality. We offer a 14-days money-back guarantee.
Need any further assistance? Call Us:+880 1700 55 95 95
Our supported payment system and security badge