Contact With Map Blueprint
A studio contact panel beside a bg-muted inline SVG map surface with a centred MapPin marker and a location chip, no third-party embed.
A studio contact panel beside a bg-muted inline SVG map surface with a centred MapPin marker and a location chip, no third-party embed.
Search blocks by description or jump to a page.
The source for every Portfolio block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Contact with Map Blueprint pairs the studio contact details with a static map surface: the left panel holds the heading, Find us in Lisbon, a short note that the studio is in Baixa five minutes from the waterfront, and a detail list with email, phone, and studio address at Rua Augusta 200. The right panel is a bg-muted surface with an inline SVG grid of street blocks and a centred MapPin marker above a label chip reading Rua Augusta 200, Lisbon. No third-party tiles, no embed.
Details are one array with Icon, label, value, and href fields. The inline SVG map with the primary-coloured pin is the distinctive detail; it gives a physical sense of place without a network request or a cookie banner.
Reach for this block when the studio has a physical address worth communicating, such as a design studio that takes client visits. The installer swaps the city, address lines, email, and phone for their own details, and adjusts the SVG street blocks to match the rough neighbourhood.
A natural flow around it on a Portfolio Pro page:
Before
After
One strong use is the studio location contact panel. Other map contact layouts:
Tip: the SVG map needs only enough detail to convey city blocks and a cross street; a sparse grid reads more clearly than an overloaded reproduction.