Map Settings

Configure your store locator map appearance, behavior, and provider settings.

Map Provider

PinPoint supports two map providers. Choose based on your needs and existing API keys.

ProviderBest For
Mapbox (default)Beautiful styles, great performance, generous free tier
Google MapsFamiliar interface, strong global coverage

After selecting a provider, enter your API key in the corresponding field. Your key is stored securely and used only for your store locator.

Default View

Control what customers see when the map first loads.

Default Center

Set the initial map center using latitude and longitude coordinates. The default centers on the United States (39.8283, -98.5795).

  • Latitude: North-south position (-90 to 90)
  • Longitude: East-west position (-180 to 180)
Finding CoordinatesRight-click any location in Google Maps and select the coordinates to copy them.

Default Zoom

The zoom level determines how close or far the map appears initially. Values range from 1 (world view) to 22 (street level).

  • 1-3: Continental view
  • 4-6: Country/region view (recommended for national businesses)
  • 7-10: State/province view
  • 11-14: City view
  • 15+: Neighborhood/street view

Map Style

Choose a map style that matches your brand. Available styles (Mapbox):

StyleDescription
StreetsClassic street map with full detail (default)
LightMinimalist light theme, great for clean designs
DarkDark theme, ideal for dark-mode websites
OutdoorsTopographic style with terrain details
SatelliteAerial imagery view

Map Dimensions

Map Height

Set the map height in pixels. The default is 500px. Consider your page layout and how much screen real estate you want the map to occupy.

Side Panel Width

Controls the width of the store list sidebar in pixels. The default is 380px. Adjust based on how much store information you display.

Markers

Default Marker Color

Set the color for store markers using a hex color code (e.g., #667eea). This color is used for all stores unless overridden by tag-based colors.

Custom Pin Image

Replace the default marker with your own custom pin image:

  1. Enable Use Custom Pin
  2. Enter the Custom Pin URL (must be a publicly accessible image URL)
  3. Set the Width and Height in pixels (default: 40x40)
Pin Image TipsUse PNG images with transparent backgrounds for best results. Keep file size under 50KB for fast loading.

Marker Clustering

When you have many stores in a small area, clustering groups nearby markers together for better performance and readability.

Clustering Settings

  • Enable Clustering: Turn clustering on or off (enabled by default)
  • Cluster Color: Color of the cluster circles (hex code)
  • Uncluster Zoom Level: Zoom level at which clusters expand to show individual markers (default: 12)

Display on Zoom Out

Control whether stores are visible when the map is zoomed out. When disabled, stores only appear after the customer searches or zooms in.

Map Popups

When Show Popups is enabled, clicking a marker shows a popup with store details. Disable this if you prefer customers to use the sidebar list exclusively.

Layout Options

Desktop Layout

Choose how the map and store list are arranged on desktop:

  • Split bar top, results on left: Search bar spans top, list on left (default)
  • Split bar top, results on right: Search bar spans top, list on right
  • Map and results on left: Map with overlaid list panel
  • List only: No map, just the store list

Mobile Layout

Choose how the map displays on mobile devices:

  • Show map above results: Map on top, store list below (default)
  • Show map below results: Store list on top, map below
  • Don't show map on mobile: List only for faster mobile loading

List Position

Choose whether the store list appears on the left or right side of the map.

Search Behavior

These settings control how search works in your store locator. Found in Settings → Behavior.

  • Show Search Bar: Display the search input (enabled by default)
  • Show Store List: Display the sidebar with store cards (enabled by default)
  • Search Radius: Maximum distance for search results
  • Distance Units: Miles or kilometers

Admin Map Features

Location Preview

When adding or editing a store in the admin dashboard, a mini map preview displays the geocoded location. This helps you verify the address was correctly converted to coordinates.

  • For existing stores: The map shows the saved latitude and longitude
  • For new stores: Select an address from the autocomplete dropdown to see the location
  • Coordinates: The exact lat/lng are displayed below the preview map
Visual Address VerificationThe location preview uses the same Mapbox API key from your settings. If you haven't configured a Mapbox key, the preview will not appear.

Address Autocomplete

When entering a store address, PinPoint provides autocomplete suggestions powered by your configured map provider. Select a suggestion to:

  • Auto-fill city, state, and zip code fields
  • Preview the location on the mini map
  • Ensure accurate geocoding when the store is saved