Determine the Center of the Map by Customer Location

Modified on Mon, 6 Nov, 2023 at 10:35 AM

Overview

By default, Store Locator will show a general map of your region on page load. You can customize the view of your map to show your customer's current location.

If your customer has location services enabled in their browser, it will show their current location in the center of the map. The map would also include any nearby stores in their area.

To determine the center of the map by customer location, please follow the steps below.


Setup

  1. From within the Store Locator app, select Settings.

    select settings

  2. Select Display Settings.

    select display settings

  3. Copy and paste this code into the Page Footer HTML field:
    <script>
    jQuery(document).ready(function(){
    var map = boldMap
    if (typeof map === 'undefined') {
    return
    }
    var infoWindow = new google.maps.InfoWindow({map: map});
     navigator.geolocation.getCurrentPosition(function(position) {
     var pos = {
     lat: position.coords.latitude,
     lng: position.coords.longitude
     };
    
     infoWindow.setPosition(pos);
     infoWindow.setContent('Location found.');
     map.setCenter(pos);
     jQuery('.search_bar button').click();
     }, function() {
     handleLocationError(true, infoWindow, map.getCenter());
     });
    
     function handleLocationError(browserHasGeolocation, infoWindow, pos) {
     infoWindow.setPosition(pos);
     infoWindow.setContent(browserHasGeolocation ?
     'Error: The Geolocation service failed.' :
     'Error: Your browser doesn't support geolocation.'); } }); </script>
  4. Select Save.

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select at least one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article