8

Manuals

Last Update il y a 5 mois

How Do I Apply Color-Schemes (Themes / Style) to my map? How Do I Set Up A Google Maps API Key? How Do I Add Custom Map Markers? How Do I Change The Distance From Miles To Kilometers? How Do I Default The "Distance" Dropdown To "No limit"

How Do I Apply Color-Schemes (Themes / Style) to my map?

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
    • Once you've copied the code, it is time to place it in the "Custom Javascript" editor of 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 of this page, click on the "Advanced Layout" button
    • Paste the code that you copied from your Map Theme website into the Custom JavaScript section.
    • Just above the first line, paste this snippet:
    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!


    Was this article helpful?

    0 out of 0 liked this article

    Still need help? Message Us