MAPPY: Dealer & Store Locator
  • 📘 About Us
    • 🗺️ MAPPY Store Locator
  • 🚀 Getting Started
    • Initial Setup
      • 1️⃣Embed App
      • 2️⃣Set Up Google API
      • 3️⃣Add First Location
      • 4️⃣Add Map Block (Optional)
    • Manage Locations
      • View all locations
      • Import by CSV
      • Import by Google Sheet
      • Export
    • Settings
      • 1️⃣General Settings
      • 2️⃣Appearance
      • 3️⃣Map Widget Popup
      • 4️⃣Translation
      • 5️⃣Content Customization
      • 6️⃣Google API Settings
        • Generating and Setting API Keys
        • Managing API Costs
    • Advanced features
      • Cloud-Based Map Styling
      • Search Records
      • Dealer Form
  • 💡 FAQ
    • Frequently asked
      • Can I change the link of the default locator page?
      • Is API key free?
      • How to create tags
      • Can I add the Store Locator app to a custom page?
      • What is special in our feature Customer Search Records?
      • How to show the Store Locator page in your Navigation menu?
      • Why can’t I validate my API key?
      • How to provide the store's collaborator code?
      • How to approve our support request?
      • How to create and use custom fields
  • 📞 CONTACT & SUPPORT
    • Contact us
    • Feature request
Powered by GitBook
On this page
  • ☁️ Benefits of Cloud-based Styling
  • 🔍 How to Access Cloud-Base Map Styling in app
  • How to connect to Cloud-based Map Styling
  • Step 1: Go to Map Styles section
  • Step 2: Click Create Style
  • Step 3: Save and Publish
  • Step 4: Create and Add a Map ID
  • Step 5: Paste your map ID to our app

Was this helpful?

  1. 🚀 Getting Started
  2. Advanced features

Cloud-Based Map Styling

With cloud-based maps styling, you can modify your map’s appearance dynamically without requiring an app update. This method is ideal for real-time adjustments and seamless user experience.

PreviousAdvanced featuresNextSearch Records

Last updated 2 months ago

Was this helpful?

☁️ Benefits of Cloud-based Styling

  • Modify map styles without updating your app's code.

  • Customize the category and density of displayed businesses.

  • Enable vector maps for improved rendering and performance.

  • Ensure brand consistency with centralized style management.

🔍 How to Access Cloud-Base Map Styling in app

To get started, click on the Settings tab in the left sidebar then select Appearance.

The Cloud-Based Map Styling will be located in the Map Styles section, below the Map Style Library.


How to connect to Cloud-based Map Styling

Step 1: Go to Map Styles section

Access the Google Cloud Console and navigate to the Map Styles, or select Go to Cloud Console in the Google Maps Styling Wizard.

Step 2: Click Create Style

Your new map style is created but not yet saved. Customize the style as needed.

Step 3: Save and Publish

  • Click Save to store your new map style.

  • In the Save and Publish dialog, enter a name and description for your style.

  • Click Save. Your new style is saved and published, appearing on the Map Styles page in the Cloud Console.

Step 4: Create and Add a Map ID

  • Create a new Map ID:

    • Click Map Management to create a new Map ID.

    • On the Map Management page, click Create Map ID.

    • Provide a name, description, and specify the map JavaScript type (raster or vector map).

    • Click Save to generate the new Map ID.

  • Associate the Map Style with a Map ID

    • Under Associated Map Styles, click the Map Style box.

    • Select your newly created map style from the list.

    • Click Save to link the map style to your Map ID.

Step 5: Paste your map ID to our app

Copy your map ID, paste it into our app then click Save


If you have any related questions, please contact us via Live chat or for further assistance.

support-sbc-ta@bsscommerce.com