Top

Determine the Center of the Map by Customer Location

To determine the center of the map by customer location, follow these steps:

  1. From "Shopify Admin", select Apps.

    select apps

  2. Select Store Locator.

    select store locator

  3. Select Settings.

    select settings

  4. Select Display Settings.

    select display settings

  5. Copy and paste this code in the "Page Footer HTML" field: 
    <script>
    jQuery(document).ready(function(){
    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>

    paste this code in the Page Footer HTML

  6. Select Save.

    Select Save

That's it! 

Have more questions? Submit a request