# Map Customization

#### Map Settings

**Content → Map Settings**

* **Map Type:** roadmap, satellite, hybrid, terrain
* **Initial View:** Fit markers, fit with padding, or manual center
* **Zoom Level:** 1-20 (default: 12)
* **Controls:** Toggle zoom, fullscreen, map type controls

***

#### Map Styling

**Design → Map Styling** - Choose from 3 styling methods:

**1. Preset Styles**

Built-in Google Maps themes:

* Silver, Dark, Night, Retro, Minimal, Aubergine

**2. Snazzy Maps**

Import custom JSON styles:

1. Browse [Snazzy Maps](https://snazzymaps.com/)
2. Copy JSON style code
3. Paste into **Custom JSON** field

**3. Builder Colors**

Simple color controls:

* **Land Color:** Landscape fill
* **Water Color:** Water bodies fill
* **Road Color:** Road fill
* **Label Color:** Label text color
* **Hide Labels:** Toggle to hide all labels

***

#### Markers

**Design → Markers**

**Global Markers**

Applied to all markers:

* **Custom Marker:** Upload image (32x32px recommended)
* **Active Marker:** Highlighted state image
* **Marker Size:** Width and height
* **Default Pin Color:** Google-style pin color (when no custom marker)

**Per-Location Markers (Manual mode)**

Override global markers per location in **Content → Locations → Location Items**

**Tip:** Use PNG with transparency for custom markers (or SVG)

***

#### Clustering

**Content → Clustering** - Group nearby markers at lower zoom levels

* **Enable Clustering:** On/Off
* **Cluster Radius:** Distance threshold (default: 60px)
* **Max Zoom:** Stop clustering at zoom level (default: 15)
* **Min Points:** Minimum markers to form cluster (default: 2)

**Design → Cluster Styling**

* **Cluster Style:** Classic or Ripple
* **Size Thresholds:** Small, medium, large marker counts
* **Colors:** Per-size cluster colors
* **Text:** Color and size

***

#### Infobox (Popup)

**Design → Infobox** - Customize marker popups

* **Width & Max Width:** Popup dimensions
* **Background Color:** Popup background
* **Padding:** Inner spacing
* **Borders:** Radius, width, color
* **Shadows:** Popup shadow

**Typography Controls:**

* **Title:** Heading typography
* **Subtitle:** Subheading typography
* **Content:** Body text typography

**Image:**

* **Width & Height:** Image dimensions
* **Aspect Ratio:** Image ratio
* **Border:** Image border radius and color

**Close Button:**

* **Size:** Button dimensions
* **Background:** Normal and hover colors
* **Border Radius:** Button roundness
* **Icon Color:** Normal and hover icon colors


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.woohoo.dance/ajax-filters/woohoo-map/map-customization.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.