Step-by-Step Guide: Add a Free Google Maps Store Locator to Your WordPress Site

Every day, potential customers are faced with the choice of visiting your business or going elsewhere. Often, this decision hinges on convenience – how easily can they find you, get directions, and verify your hours of operation?

An effectively designed Google Maps store locator eliminates these obstacles.

Customers can view your precise location, plan their route, check your operating hours, and even explore your neighborhood – all without leaving your website.

We highly recommend this feature for all businesses with a physical presence, as it connects online interest with in-person visits.

Are you ready to make it effortless for customers to visit your business? We’ll guide you through the process of creating a professional Google Maps store locator for your WordPress site.

Why Should You Add a Google Maps Store Locator to Your WordPress Site?

Many WordPress users operate small business websites catering to specific towns or regions. This includes establishments like restaurants, real estate agents, plumbers, maintenance service providers, small shops, salons, and more.

These local businesses depend on online visibility to draw in customers. Additionally, statistics show that 53% of mobile users search for directions to local stores on Google.

Integrating a Google Maps store locator into your website is essential for increasing foot traffic, as it allows potential customers to easily locate your business. They can get driving directions to your store and share your location with their friends.

This feature can also enhance your website’s search engine optimization, leading to increased visibility and attracting more visitors.

Let’s explore how to integrate a Google Maps store locator into your WordPress site. We will cover both free and paid options, highlighting their advantages and disadvantages, so you can select the best fit for your requirements.

• Method 1: Adding a Basic Store Locator to WordPress (Free)
• Method 2: Implementing a Store Locator with Local SEO (Recommended)
• Method 3: Showcasing Multiple Store Locations on a Single Map

Method 1: Adding a Basic Store Locator to WordPress (Free)

This method is both free and straightforward, as it eliminates the need to create a Google Maps API key. We recommend it for users who want to quickly add a simple map indicating their store’s location.

To get started, visit the Google Maps website on your computer. Enter your store’s address in the search bar, and Google Maps will display it on the map with a pin.

Ensure the marker is accurately positioned on the map. You can adjust the zoom level by clicking the zoom buttons located in the bottom right corner.

Once you are satisfied with the appearance of the map, click the ‘Share’ button in the left column. In the popup window, switch to the ‘Embed a map’ tab.

You will now see your selected location on the map along with the HTML code. To obtain the embed code, click the ‘Copy HTML’ link.

Next, navigate to the admin area of your WordPress site and edit the post or page where you want to add the store locator map.

Typically, users integrate a store locator map on their contact page, which includes their business phone number and operating hours.

On the post editing screen, you need to insert a ‘Custom HTML’ block.

Paste the code you copied from Google Maps into the text area of the ‘Custom HTML’ block.

You can now preview the page to see the embedded Google Maps. The map will display your store location, along with links for directions and saving the location.

This method is effective for quickly embedding Google Maps, but it may not provide optimal SEO benefits. In other words, it won’t significantly improve your ranking or increase traffic from search engines or Google map searches.

If you own a small business, restaurant, or online store with one or more physical locations, we highly recommend this solution to enhance your local SEO performance.

Method 2: Integrating a Store Locator for Enhanced Local SEO (Recommended)

Approximately 46% of all Google searches have a local focus. All in One SEO (AIOSEO) is the leading WordPress SEO plugin available, designed to drive more organic traffic from search engines to your website.

At CanadaCreate, we have utilized AIOSEO to enhance our article rankings in search results, and our experience has been very positive. For a comprehensive review, be sure to check out our full AIOSEO evaluation.

This plugin is also an excellent store locator tool, allowing you to input your store locations, contact information, and business hours using schema markup, ensuring that this information appears in search engine results pages.

For instance, when you search Google for ‘McDonald’s locations in Florida,’ it displays a featured snippet that includes a list of locations along with a map highlighting the pinned spots.

Implementing this will enhance your website’s SEO rankings and boost your click-through rate in search results.

Begin by installing and activating the AIOSEO for WordPress plugin. For detailed instructions, refer to our comprehensive guide on installing a WordPress plugin.

After activation, the plugin will initiate a setup wizard. If you require assistance with the configuration, please consult our guide on setting up AIOSEO for WordPress.

Once the setup is finished, navigate to All in One SEO » Local SEO in your WordPress dashboard.

Click the ‘Activate Local SEO’ button to begin configuring your local settings.

Next, click the ‘Maps’ tab located at the top of the Local SEO page.

On the Maps page, locate the ‘API Key’ field.

To obtain an API key for Google Maps, visit the Google Maps Platform and sign in with your Google account.

Then, click the ‘Get Started’ button.

Google Cloud resources are categorized by project. If you do not have an existing project, one will be automatically created for you.

Keep in mind that you will need to enable billing for the project to use the Google Maps API, but it’s unlikely that you will incur any charges.

Embedding maps is free with unlimited usage as outlined in Google’s documentation, and you receive a monthly credit of $200.

Click the ‘Create Billing Account’ button to proceed.

You will now see the Account Information page. Select your country from the drop-down menu and agree to the terms of service.

When you’re ready, click the ‘Continue’ button to move forward.

Next, choose an existing payment profile or create a new one.

The profile can be for an individual or a business and will include the name, payment method, and address.

After entering that information, click the ‘Start My Free Trial’ button.

Don’t be concerned about the ‘Free Trial’ label. Map embedding remains free even after the trial ends, and your credit card won’t be charged until you decide to upgrade to a paid account.

You may be prompted to complete a brief 30-second survey about your business to receive the most relevant information.

Once you click the ‘Submit’ button, your Google Maps API key will be shown. You will need to enter this key in the plugin settings for Methods 2 and 3.

Click the ‘Copy to Clipboard’ icon located at the end of the ‘Your API Key’ field. After copying, close the popup by clicking the ‘Go to Google Maps Platform’ button.

How to Restrict Your Google Maps API Key

We advise restricting the key to prevent unauthorized use by others.

Once you create your API key, a popup will appear prompting you to ‘Protect your API key,’ allowing you to restrict its use to your own website.

In the ‘Select restriction type’ dropdown menu, choose ‘HTTP referrers (web sites).’ In the following field, enter your website domain name in the ‘New item’ field using the format*example.com/*.

You should see a confirmation message stating, ‘Successfully restricted your API key.’ This ensures that the key will only function for Google Maps embedded on your specific website.

On your website, input your API key in the designated field. Then, scroll down to adjust the map settings.

AIOSEO allows you to integrate Google Maps using a Gutenberg block, shortcode, widget, or PHP code. You can also select various map styles and add a custom marker to your map.

In this tutorial, ensure that the ‘Gutenberg Block’ option is selected. Remember to click the ‘Save Changes’ button once you finish.

You can now create your store locator map. The process varies depending on whether your business has a single location or multiple locations.

Creating a Map for a Single Location

If your business is based at a single physical address, the map will utilize the information you provide on the ‘Locations Settings’ page of All in One SEO.

Now, navigate to the ‘Locations’ tab of theAll in One SEO » Local SEOpage.

Since you have only one physical location, ensure that the ‘Multiple Locations’ option is set to ‘No’.

Next, scroll down to the ‘Business Info’ section and provide as much detail about your business as possible.

This information is crucial as it may appear when someone searches for your business on Google or Google Maps.

After that, scroll to the ‘Maps’ section to mark your precise location.

Simply input your address in the ‘Enter a query’ field. A pin will be placed at that location, and you can adjust the pin by dragging it if needed.

After completing your changes, scroll to the top or bottom of the page and click the ‘Save Changes’ button to apply your settings.

You can now incorporate your store locator map into any WordPress post or page. Begin by editing an existing post or creating a new one on your website.

In the block editor, click the ‘+’ button at the top and insert the ‘AIOSEO Local – Map’ block anywhere on the page. Remember to click ‘Update’ or ‘Publish’ once you’re done.

Congratulations! You have successfully integrated a Google Maps store locator into your website.

Adding Maps for Multiple Locations

To include a map for another location, go to the Locations tab in theAll in One SEO » Local SEOpage. Here, select the ‘Yes’ option for Multiple Locations and click the ‘Save Changes’ button at the top of the screen.

After saving your changes, you will see a new Locations custom post type added to the admin sidebar. This is where you can input your business locations.

Now, navigate toLocations » All Locationsand click the ‘Add New’ button.

This will direct you to the Locations editor. Here, you need to provide a title for the location you are adding, such as the store name or the city.

Next, scroll down to the ‘AIOSEO Local Business’ section of the page, located beneath the post content.

Be sure to include as much information as possible, as this may appear when someone searches for your business on Google Search or Google Maps.

Then, locate the ‘Maps’ section and input your address in the ‘Enter a query’ field.

A pin will appear at that specified location.

After entering your location on the map and providing the necessary information, click the ‘Publish’ button.

You can now repeat this process to add your other business locations.

Once you are done, you can incorporate a store locator map on your website for each location using the ‘AIOSEO Local – Map’ block in the WordPress editor.

Now, you need to select which location to display on the map.

To do this, check the block settings pane on the right side of the screen and select the store you want to display from the ‘Location’ drop-down menu.

Easily add more local map blocks for additional locations. Remember to click the ‘Publish’ or ‘Update’ button at the top of the page to ensure the maps are visible on your website.

Method 3: Show Multiple Store Locations on One Map

The first two methods allow you to add store locator maps for individual locations. If you have several locations, you will need to create a separate map for each one.

Alternatively, you can utilize our third method to display all locations on a single map.

First, install and activate the Locatoraid Store Locator plugin. For detailed instructions, refer to our step-by-step guide on installing a WordPress plugin.

After activation, navigate to Locatoraid » Configuration to configure the plugin.

In the ‘Google Maps’ tab, you will need to enter your Google Maps API key. You can follow the instructions in Method 2 to generate one.

Next, click the ‘Save’ icon to store the key. You should see that Google Maps loads correctly in the ‘Map Style Preview’ window.

Then, go to the ‘Configuration’ tab and select whether you want to display distances in miles or kilometers on the map.

Explore additional options, including the address format, the information you want to display on the map, and the user permissions for the plugin.

After adjusting the plugin settings to your satisfaction, be sure to click the ‘Save’ button to apply your changes.

You are now set to add your store locations. Navigate to Locatoraid » Locations. Click the ‘Add New’ button to proceed.

This will direct you to the ‘Add New Location’ page, where you can enter the store name, address, and other relevant details.

Once you have entered all the information, click the ‘Add New Location’ button at the bottom of the page.

You will be redirected to the ‘Edit Location’ page, where you can see the store’s location displayed on a map.

If everything appears correct, click the ‘< Location’ button at the top of the screen to go back to the Locatoraid » Locations section in your dashboard.

To add more locations, simply click the ‘Add Location’ button and repeat the process.

Once all your store locations are set up, you can integrate the map into your website.

Just add or edit a page, click the blue ‘+ Add Block’ icon, drag a Shortcode block onto the page, and enter the shortcode.[locatoraid]into the designated field.

This default shortcode is suitable for most websites. However, you can enhance the map’s features by using an alternative shortcode. For more details, visit the Locatoraid » Publishpage.

Now, you can publish or update the page and check your website to view your store locator map.

All of your store locations will be shown on a single map. Users can enter their address or click the ‘Locate Me’ link to find the nearest stores and obtain directions.

We hope this tutorial has helped you understand how to add a Google Maps store locator to your WordPress site. You might also be interested in learning how to create an interactive map in WordPress or exploring our list of the best schema markup plugins for your website.

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