Top

Customize the Pins on the Map with a Custom Image

You can customize the pins in the store locator widget by copying and pasting the folowing code into the "Page Footer HTML" field of the display settings page in the app admin.  You'd need to upload the images files into your shopify admin and then replace the ####, !!!!, and **** with the file pathways of those images.

<script>
old_add_markers = add_markers;
add_markers = function (){
        // this is the default Icon image displayed on the map
        mainIcon = "####";
         // this is the icon used to display the users address
        youIcon = "!!!!";
         // this is a shadow used for both icons
        myshadow = "****";
        add_markers = old_add_markers;
        add_markers ();
}
</script>
<style>
#direction_destination, .addresses li {
/*this should also be the default Icon image displayed on the map */
background-image: url("####");
}
</style>

#### is the file pathway for the icon's on the amps

!!!! is the file pathway for the icon's in the results section

**** is the file pathway for a shadow image used for both sets of icons

Have more questions? Submit a request