How to Embed an Interactive Map on Your Campsite Website

← Back to Blog

Why Add an Interactive Map?

An interactive site map on your website lets potential guests explore your park before they book. They can zoom in on specific areas, see where pitches are in relation to facilities, and get a real feel for the layout. It builds trust and can be the difference between a booking and a bounce.

How It Works

Our interactive map viewer is a lightweight widget that loads on any web page. It works with WordPress, Wix, Squarespace, custom-built sites — anything that lets you add a snippet of HTML.

Once we've designed your 3D site map, we give you a unique map token. You then add two lines of code to your website:

The embed code

<div id="pitchplan-map" data-token="YOUR_MAP_TOKEN"></div>
<script src="https://pitchplan.pro/embed/site-map-viewer.js"></script>

That's it. The viewer loads your map data automatically, renders the 3D isometric view, and gives your visitors full pan, zoom, and tap-to-explore functionality.

What Visitors Can Do

• Pan and zoom — drag to move around the map, scroll (with Ctrl) or pinch to zoom
• Tap for details — click on pitches and facilities to see labels and descriptions
• View the key — a colour-coded legend shows pitch types, buildings, and facilities
• Use on mobile — fully touch-optimised for phones and tablets

Adding It to WordPress

In WordPress, you can add the embed code using a Custom HTML block in the block editor. Just paste the two lines into the block and publish. No plugins needed.

Adding It to Wix or Squarespace

Both Wix and Squarespace support custom HTML embeds. In Wix, use the "Embed a Site" or "Custom Element" widget. In Squarespace, use a "Code" block. Paste the two lines and save.

Try It Yourself

See a live demo of our interactive viewer in action, or request a quote to get started with your own site map.