logo

Agile Store Locator - Knowledge Base

How can we change the color of Google Maps?

Agile Store Locator has builtin 9 styles of Google Maps which can be used on your Store Locator page, Admin can apply these settings from ASL Settings or shortcode attribute map_layout. If the provided styles don't fulfill the requirement, you can follow the steps to generate your own Google Maps style by following the steps.

  • Open up Snazzy Map Editor to Create your own Map style.
  • Apply all the required color and styles to your Google Map and click View Code to see the generate style JSON.
    Snazzy Map

    Image of Snazzy Map Style

  • Copy the JSON and open up the plugin file.
    \wp-content\plugins\agile-store-locator\public\class-agile-store-locator-public.php
    Store Locator Public File

    Image of Store Locator Public File

  • Paste the copied JSON replace the highlighted content of line 416, Paste the new JSON into it, the line number can be different in the newer version.
  • Use shortcode [ASL_STORELOCATOR map_layout="0"]

Once you apply the steps properly, you will see the Google Map of Store Locator with your own created style.