Skip to main content

Map Sections

Map sections embed a Google Map on your page with zero setup — no API key, no billing account, no configuration. Type an address, pick a layout, and publish. This guide covers the layouts, the loading modes, and when a map section earns its place on a page.

What Are Map Sections?​

A Map section is a standard Promptless section — eyebrow, heading, and intro content at the top; outro text and buttons at the bottom — with a live Google Map in the middle. It's built for the pages where visitors ask "where are you?":

  • Contact pages — the classic use, especially in the Split layout beside your contact details or a form
  • Location / visit-us pages — service businesses, restaurants, clinics, venues
  • Event pages — show attendees exactly where to go
  • Service-area pages — anchor a local landing page to a real place

Like every Promptless section, the map inherits your design system automatically: global corner radius, section spacing, light and dark theme variants, and scroll animation all apply with no map-specific settings to manage.

Setting the Address​

The Map Address field takes a plain address — street, city, landmark, or business name. No coordinates, no map IDs.

If you leave the address empty, the map falls back to the address saved in your Business Identity (Promptless WP → Business Identity). For most sites this means adding a map takes zero data entry: your address is already there, and the map, your LocalBusiness schema, and your contact page all stay in sync from one record. Update the address in Business Identity and every map using the fallback follows.

Layouts​

Stacked (default) — Your heading and content sit above a full-width map, with outro and buttons below. The general-purpose arrangement. In this layout you also choose the map's aspect ratio: 16:9 (wide, default), 4:3, or 1:1 (square).

Split — Your content column sits beside the map, which fills the column height. This is the classic contact-page composition: heading, address, phone, and hours (or a contact form shortcode) on one side, the map on the other. A Map Position control puts the map on the left or right.

Zoom Levels​

Zoom is a choice of three named levels rather than a raw number:

  • Street — close-in, individual buildings visible. Best when the exact entrance matters.
  • Neighborhood (default) — a few blocks of context. The right choice for most businesses.
  • City — wide view. Useful for service-area businesses where the region matters more than the pin.

An optional link below the map (on by default) opens Google Maps navigation to your address in a new tab. It costs nothing to render and works even before the map itself has loaded — for visitors on phones, it's often the only interaction they actually want.

Loading Modes​

Maps are heavy — a Google embed brings roughly a megabyte of scripts and tiles with it. The Map Loading setting controls when that cost is paid:

Auto (default) — The map loads lazily as the visitor scrolls toward it. On the typical layout (map partway down a contact page), your page's initial load and Core Web Vitals are unaffected, and the section reserves its space so nothing shifts when the map appears. This is the mode most sites should use: visitors see a map without doing anything.

Click to load — The section shows a styled placeholder — your address, a map-pin icon, and a "Load map" button on a surface that matches your design system — and nothing is requested from Google until the visitor clicks. Choose this when:

  • The map sits above the fold, where even lazy loading would compete with your page's first paint
  • You want a strict privacy posture — no Google cookies or requests until the visitor explicitly opts in, which simplifies GDPR consent handling
  • The page is performance-critical and every third-party byte matters

Map assets only load on pages that actually contain a Map section, in either mode.

Design and Content Tips​

  • One map per page. A map is a destination block, not a decoration. If you have multiple locations, give each its own page (or list them in a Features section that links out).
  • Pair Split with a form. The content column in Split layout accepts a form shortcode — a contact form beside the map is the highest-converting arrangement for "get in touch" pages.
  • Keep the heading practical. "Visit us" / "Find our office" outperform clever headings here; visitors reaching a map section are looking for logistics, not persuasion.
  • Dark sections work. The map itself stays a standard Google embed, but the surrounding section, placeholder, and directions link all follow your dark theme variant correctly.

What Map Sections Don't Do​

By design, version one keeps the surface small: one pin per map (no multi-location pins), Google Maps only (no OpenStreetMap or custom tile styling), and no custom map skinning. If your use case needs more, the "Get Directions" link plus a well-written address block covers most of the gap.

Connector Support​

Map sections deploy through the Promptless Connector like any other section — ask Claude to "add a map section to the contact page using our business address, split layout with the map on the right" and every field above is available to it.