Google Maps is a powerful web mapping service that allows users to view and navigate through maps worldwide. It’s become an invaluable tool for businesses, allowing them to easily show their location, route customers there, and provide directions without having to spend time on complex coding.
Embedding Google Maps into your website is a great way to make it easier for visitors to find your storefront or discover how close or far it is to them right from their mobile devices. Here we will show you how easy it is to embed a Google Map on websites like yours using just a few simple steps.
Anyone who services a local area should seriously consider a Google Maps embed section on their website.
It doesn’t matter if you work one or twenty locations, giving web visitors a visual of where you are helps customers find you. At the very least, it helps customers know your proximity and understand how quickly they can get the products or services they need.
Source: True Tone Stone Polishing & Carpet Cleaning (a GoSite customer)
These businesses include…
Source: Your Cleaning Partner (a GoSite customer)
Adding Google Maps to your website helps your customers to easily locate your business and plan their trip. Here's how it works:
Adding Google Maps to your website not only makes it easy for customers to find you, but it also provides them with tools and information that enhances their overall experience.
If your business has a physical location, sharing this information on your website provides customers with an easy way to find it. It’s helpful for customers and provides them with a sense of security that there is an actual place to visit should they need more assistance or support related to their query. It also helps them to know how far your business is from their house if speed or travel costs factor into whether they choose you for the job.
Search engine optimization (SEO) is the process of tailoring a website for search engines so that it appears higher in the results when someone searches for related terms. For businesses with physical locations, having your business address listed on Google Maps is beneficial as it adds local SEO value to your website.
Source: Tuszk Quality Junk Removal & Moving (a GoSite customer)
This means when people put “plumbers near me” or “auto repair shops in my town” in their search bar, your business may appear towards the top of their results page.
The first step to embedding a Google Map on your website is creating an account with Google Maps. You can do this by visiting the Google Maps Platform and signing up for an account using your existing Google credentials.
If you don’t already have a Google account, go to Google’s sign-up page and enter your information. You should be sent a verification email to make your account legitimate so you can log in to Google and Google Maps whenever you like with the credentials you’ve entered.
Note: This process is far easier if you have created and verified your Google Business profile. More importantly, a verified Google Business account is critical for helping your business get found online.
Once you’ve created your Google Maps account, the next step is to locate your business on Google Maps. To do this, search for your business name in the top-left corner of the page and click “Enter”. When you find it, click on it to open up its profile page.
On the profile page, you should see a share icon. Click on it and a popup window within your browser window will appear. This is where you can share your business details with others.
In the popup window, you should see the options of “Send a link” or “Embed a map” at the top. Select “Embed a map” and the Google Maps embed code will be generated automatically for you.
Next to the code will be blue text that says “Copy HTML”. Press this text to copy the code, as it is what we will use to embed the map on your website. See the video above for visual instructions on this and the past few steps.
Google Maps provides a few options for you to make your map your own. These include custom size, zoom level, and more. You can also change the language of your map and other settings, like whether or not you want to show traffic, transit information, or terrain. For this step, think about your usual customers and what information would be most beneficial to them.
Once you’ve chosen your settings, Google Maps will provide you with the HTML code for embedding the map on your website. Copy this code and save it somewhere as we will need it later.
Now that you have the HTML code, it’s time to embed the map on your website. To do this, open up your website's HTML editor and paste in the code that Google Maps provided for you. Save your changes and then preview the page to make sure everything looks as it should.
Once you’re happy with the way your map looks, save and publish your website. Your embedded Google Map should now be visible to anyone who visits your page.
Google Maps API is a powerful platform that allows developers to extend the basic capabilities of Google Maps. With it, you can customize your maps with advanced features like custom markers, directions, layers, and more. It also allows for easier integration into websites by providing code snippets to copy and paste onto your web pages.
When using the Google Maps API, you extend the basic features of Google Maps to include more advanced capabilities like:
Source: Google and Balbooa
The first step to embedding a Google Map into your website is to obtain an API key from the Google Developer Console. An API (Application Programming Interface) is a set of instructions that allow two websites or applications to talk with each other. Without an API key, you won’t be able to access the full range of features on the Google Maps platform.
To get started, head over to https://console.developers.google.com/apis and click ‘Create a project’ in the top right-hand corner of your screen. Give it a name and select ‘Maps Embed API’ from the list of available APIs.
Next, click ‘Enable’ and you should be taken to a page with your unique Google Maps API key. Make sure to copy this somewhere safe as it will be needed later in the process.
Once you’ve got your API key, it’s time to choose the perfect place for your Google Map. Consider where on the page or website you want it to appear and make sure that this is somewhere that will be easy for visitors to spot. You may also want to consider whether or not a static map image would be more suitable than an interactive one.
Now that you’ve got your API key and chosen the best location for your map, it’s time to access the Google Maps Embed API. This is where you customize the look of your map and add extra features like markers or directions.
Head to https://developers.google.com/maps/documentation/embed/guide and select ‘Get Started’ from the top menu bar. Here you will be asked to enter in some basic information like your API key, language preferences, zoom level, and center point (the longitude & latitude coordinates of where you want your map to be centered).
An embedded code is the text that will be placed on your website to display the Google Map. To get this code, go back to the Google Maps Embed API and click ‘Get Code’. This will bring up two pieces of code - one for HTML and one for JavaScript. Copy down both codes as you’ll need them to embed your map correctly.
If you want to customize the look and feel of your map, you can do this by going back into the Google Maps Embed API. Here you can add extra features like markers or directions, change the zoom level and center point, add a border, or even change the background color.
Once you’ve made all your changes, simply generate an HTML code and paste it into your page editor. This will embed the Google Map into your website and make it available for visitors to use.
Now that you’ve embedded your map, it’s time to test it out. Head over to the page or post where you pasted in the HTML code and make sure that everything is working as expected. Once you’re happy with the results, hit ‘save changes’ and you should be all set!
Embedding a Google Map into your small business website is an easy and effective way to provide customers with detailed information about your exact location. It’s also a great way to make sure that visitors can easily find their way to you, whether they’re coming from across the country or just around the corner.
By following these steps, you can quickly embed a powerful interactive map on your site that will give customers all of the information they need to get there without any difficulty. It’s a great way to make sure your business stands out and that potential customers find you no matter where they are.