Skip to content

How to Add Google Maps Store Locator in Divi (WordPress) - Local SEO

Do you own a business with more than one location? Want to make it effortless for customers to find your nearest physical store and boost walk-in sales? You need a store locator.

According to a Nielsen study, 76% of smartphone shoppers use store locators to plan their physical store visits.

(Source: Nielsen Mobile Shopping Insights)

The Local SEO For Divi & Gutenberg Blocks plugin includes a dedicated Store Locator Divi Module, allowing you to add an interactive, fully customizable store locator to any page in minutes.

Pre-Requisites

Section titled “Pre-Requisites”

Pre-Requisites

Setup Local SEO Settings

Section titled “Setup Local SEO Settings”

  1. Ensure you have configured your core Local SEO settings before displaying your store locator:

    • Access settings in WordPress Admin > Settings > Locations & SEO.
    • If you have already configured local SEO settings, you can skip this step.
    • For a complete guide, see Local SEO Configuration.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Add Location Data To Your Website

Section titled “Add Location Data To Your Website”

  1. The store locator displays your physical business addresses on an interactive map:

    Ensure your location entries are created in WordPress.

    If your location data is already set up, you can skip this step.

    • Each location entry stores essential details (address, phone number, hours) used for Local SEO Schema data.
    • Fill in key address and contact fields for maximum SEO impact.
    • For step-by-step instructions, see Add Business Locations In WordPress.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Insert “Store Locator” Divi Module On a Page

Section titled “Insert “Store Locator” Divi Module On a Page”

  1. To add a store locator to any page:

    • Edit your page using the Divi Visual Builder.
    • Inside a Divi Row, click the + button labeled Add New Module.
    • In the module search box, type Store Locator and select the Store Locator module.
    • The interactive Store Locator module is now active on your page.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Search Form (Content Tab)

Section titled “Search Form (Content Tab)”

  1. The Search Form controls the search bar displayed above or alongside the map, enabling visitors to filter stores by Address, Category, and Radius Distance.

    Available settings include:

    • Search Box Placeholder Text: Set custom placeholder text for the address search field.
    • Show Category Dropdown: Toggle visibility of the category filter dropdown.
      • Category Placeholder Text: Custom prompt text for the category dropdown.
    • Show Radius Dropdown: Toggle visibility of the search radius filter dropdown.
      • Radius Options: Enter comma-separated distance values (e.g., 5, 10, 25, 50).
      • Distance Units: Choose between Kilometers or Miles.
      • Radius Placeholder Text: Custom prompt text for the radius dropdown.
    • Search Button Text: Customize the action button text (e.g., “Find Stores”).

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Locations (Content Tab)

Section titled “Locations (Content Tab)”

  1. The Locations tab controls which business branches are fetched and filtered:

    Available settings include:

    • Filter By Category: Enable or disable filtering by category.
      • Categories: Select specific category checkboxes to display.
    • Include Locations (comma-separated IDs): Specify exact location post IDs to display.
    • Exclude Locations (comma-separated IDs): Specify exact location post IDs to hide.
    • Number Of Locations To Fetch: Set the maximum number of locations loaded. Use -1 to load all locations.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Map (Content Tab)

Section titled “Map (Content Tab)”

  1. Configure general Google Maps display behaviors and interactive controls:

    Available settings include:

    • Height: Set map container height in pixels.
    • Map Type: Select your preferred map view:
      • Hybrid: Displays satellite imagery overlaid with prominent road networks.
      • Roadmap: Standard Google Maps street view.
      • Satellite: High-resolution aerial satellite imagery.
      • Terrain: Displays physical terrain, elevation contours, and natural vegetation.
    • Gesture Handling: Controls touch and scroll interactions:
      • Auto: Automatically toggles cooperative or greedy behavior based on page layout.
      • Co-operative: Single-finger touches scroll the web page smoothly without trapping map navigation. Two fingers pan and zoom the map.
      • Greedy: All touch and scroll events directly pan or zoom the map.
      • None: Disables interactive panning and zooming gestures.
    • Show Cluster Markers: Toggle to group dense nearby location pins into numbered clusters.
    • Restrict Locations By Countries: Limit autocomplete address searches to specific countries by entering 2-letter country codes (e.g., US, CA, UK). View ISO Country Codes.
    • Ask User To Share Location: Prompt visitors for automatic browser geolocation (requires an HTTPS secure website connection). Automatically centers the map on the visitor’s location when accepted.
    • Default Zoom Level: Set default map magnification level.
    • Map Center - Latitude & Longitude: Set custom geographic coordinates for the initial map center.
      • Tip: Open Google Maps, right-click any location, and click the coordinates to copy latitude and longitude directly to your clipboard. View Google Maps Help.
    • Empty Results Text: Display custom messaging when no matching locations are found.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Map Controls (Content Tab)

Section titled “Map Controls (Content Tab)”

  1. Customize interactive on-screen map control buttons and positions:

    Available settings include:

    • Show Map Type Control: Toggle map type selection buttons (Roadmap, Satellite, Hybrid, Terrain).
      • Map Control Position: Choose placement on map (e.g., Top Left, Top Right, Bottom Right).
    • Show Zoom Control: Toggle (+/-) zoom buttons.
      • Zoom Control Position: Choose placement on map.
    • Show Scale Control: Toggle map scale indicator bar.
    • Show Street View Control: Toggle Google Pegman Street View button.
      • Street View Control Position: Choose placement on map.
    • Show Rotate Control: Toggle map rotation control.
      • Rotate Control Position: Choose placement on map.
    • Show Fullscreen Control: Toggle full-screen map expansion button.
      • Fullscreen Control Position: Choose placement on map.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Listing & Info Window (Content Tab)

Section titled “Listing & Info Window (Content Tab)”

  1. Control which location information fields display on the store listing list and map info popups:

    Available options include:

    • Show Info Window: Toggle popup info windows when clicking a map pin.
    • Show Title: Toggle location name display.
    • Show Address: Toggle street address display.
    • Show Telephone Number: Toggle phone number display.
    • Show Email: Toggle email contact link display.
    • Show Description: Toggle summary description display.
    • Show Direction Link: Toggle driving directions link display.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Form Container (Design Tab)

Section titled “Form Container (Design Tab)”

  1. Customize wrapper styling enclosing the search form:

    Design options include:

    • Spacing (Margin and Padding)
    • Background Color
    • Rounded Corners (Border Radius)
    • Border Styles & Colors
    • Box Shadow Effects

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Input Container (Design Tab)

Section titled “Input Container (Design Tab)”

  1. Customize spacing and alignment surrounding search input fields:

    Design options include:

    • Spacing (Margin and Padding)

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Search Input & Dropdown Fields (Design Tab)

Section titled “Search Input & Dropdown Fields (Design Tab)”

  1. Style search text inputs, category dropdowns, and radius dropdown menus:

    Design options include:

    • Spacing (Margin and Padding)
    • Typography, Font Family, Size & Color
    • Rounded Corners
    • Borders & Focus States

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Search Button (Design Tab)

Section titled “Search Button (Design Tab)”

  1. Customize the search action button:

    Design options include:

    • Typography & Text Styles
    • Background Color & Hover Effects
    • Rounded Corners
    • Borders
    • Button Icons
    • Alignment
    • Spacing (Margin and Padding)
    • Box Shadows

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Map & Listing Parent Container (Design Tab)

Section titled “Map & Listing Parent Container (Design Tab)”

  1. Customize the main container holding both the map and location list:

    Design options include:

    • Layout: Choose between two layout structures:
      • Stacked - Map on top of listing: Map and store listing list stacked vertically.
      • Inline - Map & listing on single row: Displays map and store list side-by-side in a single row.
        • Map Container Width (%): Adjust percentage width allocated to the map container.
    • Spacing (Margin and Padding)
    • Rounded Corners
    • Borders

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Map Container (Design Tab)

Section titled “Map Container (Design Tab)”

  1. Customize wrapper styling surrounding the map frame:

    • Spacing (Margin and Padding)

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Map (Design Tab)

Section titled “Map (Design Tab)”

  1. Configure map styling assets and custom marker icons:

    Design options include:

    • Map Styles:
      • Apply custom color schemes to Google Maps.
      • Visit the Google Maps Styling Wizard.
      • Select No thanks, take me to the old style wizard.
      • Customize map colors, landmarks, and road styling.
      • Click FINISH and copy the generated JSON style code into this field.
    • Your Location Icon: Upload a custom pin image representing the user’s searched address or current location (recommended size: 100px x 100px).
    • Directions Icon: Select driving directions button icon (recommended size: 100px x 100px).
    • Address Icon: Custom street address icon used in listings and info windows (recommended size: 100px x 100px).
    • Telephone Icon: Custom phone icon used in listings and info windows (recommended size: 100px x 100px).
    • Email Icon: Custom email icon used in listings and info windows (recommended size: 100px x 100px).
    • Box Shadow Effects

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Listing Control (Design Tab)

Section titled “Listing Control (Design Tab)”

  1. Customize wrapper styling for the location list panel:

    Design options include:

    • Spacing (Margin and Padding)
    • Rounded Corners
    • Borders
    • Box Shadows

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Single Location Parent Container (Design Tab)

Section titled “Single Location Parent Container (Design Tab)”

  1. Style individual location card item wrappers inside the list:

    Design options include:

    • Spacing (Margin and Padding)
    • Rounded Corners
    • Borders
    • Box Shadows

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Location Title (Design Tab)

Section titled “Location Title (Design Tab)”

  1. Style location title headings in listings and info windows:

    Design options include:

    • Typography, Font Size, Weight & Color

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Location Description (Design Tab)

Section titled “Location Description (Design Tab)”

  1. Style summary description text in listings and info windows:

    Design options include:

    • Typography, Font Size & Color

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Location Address (Design Tab)

Section titled “Location Address (Design Tab)”

  1. Style physical address text in listings and info windows:

    Design options include:

    • Typography, Font Size & Color

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Location Telephone (Design Tab)

Section titled “Location Telephone (Design Tab)”

  1. Style phone number text in listings and info windows:

    Design options include:

    • Typography, Font Size & Color

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Location Email (Design Tab)

Section titled “Location Email (Design Tab)”

  1. Style email contact links in listings and info windows:

    Design options include:

    • Typography, Font Size & Color

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Formatted Distance (Design Tab)

Section titled “Formatted Distance (Design Tab)”

  1. Style calculated distance indicators displayed between visitor search locations and store entries:

    Design options include:

    • Typography, Font Size & Color

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial

Custom CSS (Advanced Tab)

Section titled “Custom CSS (Advanced Tab)”

  1. Apply granular CSS customizations to store locator components:

    • Inject custom CSS rules for individual store locator elements.
    • Access specific element targeted CSS fields.

FREE DOWNLOAD

Start your FREE trial. No credit card required.

Start Risk-Free Trial