Adding custom styled maps to your map page is quick and easy with our "Store Locator - W3" app!
Just follow these brief few steps, and your map will be personalized, and looking "Snazzy" in no time!
For this tutorial, we will be using "Snazzy Maps" as an example to pick and apply our styles from.
Step 1: Find/Copy a Theme on SnazzyMaps.com
- Head on over to Snazzymaps.com and find your favorite theme.
(Similarly formatted theme websites will also work)
- Once your theme is picked, take a look on the left-hand side of the page and copy the code that appears within the gray box. (Highlighted below in Green)
Step 2: Paste the Code Into Our App
- Navigate to the app by clicking on the "Apps" link in the left hand side of your Shopify admin, and clicking on the "Store Locator - W3" app.
- Once you're in the app, click on the "Design/Layout" tab.
- At the top right of this page, click on the "Advanced Layout" button
- Just above the first line, paste this snippet:
var storeLocatorMapStyle =
- Your final result should look something like this:
Step 3: Save the Editor
- Scroll to the bottom and click "Save".
Go to the front end of your store and take a look at the map!
Your styles should now be applied to the map and are visible to the public!
If you have any trouble, please feel free to reach out to us at email@example.com