Skip to content
OuterSpatial Help Center home
OuterSpatial Help Center home

Map Embeds

Map embeds let you display interactive OuterSpatial maps directly on your own website. Visitors can explore areas, trails, points of interest, and outings without leaving your site.

This feature is available as an add-on for Enterprise customers. If you don't see the map embed options described in this article, contact your OuterSpatial representative to enable it for your organization.

Setting Up Map Embeds (Admins)

Before your team can create map embeds, an organization admin must enable the feature and configure allowed domains.

Enable Map Embeds

In OuterSpatial Manager:

  1. Go to Organization > Settings > Map Embeds

  2. Toggle the map embed tool on for your organization

Once enabled, staff members will see the Embed Map option when viewing areas, trails, points of interest, and outings.

Add Allowed Domains

For security, embedded maps only load on domains you've explicitly approved. In OuterSpatial Manager:

  1. In Organization > Settings > Map Embeds, find the Allowed Domains section

  2. Add each domain where you plan to embed maps (e.g., yourorganization.org, blog.yourorganization.org)

  3. Save your changes

If someone embeds a map on a domain that isn't in this list, the map won't load.

Creating a Map Embed

You can create embeds for any area, point of interest, trail, or outing in your organization.

  1. Navigate to the area, point of interest, trail, or outing you want to embed

  2. Click the More button in the upper, right-hand corner of the page

  3. Select Embed Map

This opens the embed configuration modal, which walks you through three steps.

Step 1: Configure

Customize how your embedded map looks and behaves.

Map Interaction

  • Clickable — Allow visitors to click on map features for more information

  • Scroll Zoom — Enable zooming with the mouse scroll wheel

  • Default Basemap — Choose which basemap displays when the map loads

Display Options

  • Search — Show or hide the search bar

Map Controls

  • Fullscreen — Let visitors expand the map to fullscreen

  • Basemap Switcher — Allow visitors to switch between available basemaps

Step 2: Preview

Review how your map will appear on your website. If something doesn't look right, go back to Step 1 and adjust your settings.

Step 3: Copy & Embed

The modal displays a <script> element containing your embed code. Click Copy Code to copy it to your clipboard.

Adding the Embed to Your Website

Paste the copied <script> element into your website's HTML where you want the map to appear. The map will automatically render in that location and take up 100% of the available height/width of its parent container.

<!-- Example placement -->
<div class="map-container">
  <script src="..."></script>
</div>

Work with your web developer or content management system to place the code appropriately. Most website builders and CMS platforms support adding custom HTML or script elements.

Troubleshooting

The map isn't loading on my website.

Check that the domain is in your Allowed Domains list. Maps only load on whitelisted domains. If you recently added the domain, try refreshing your website.

I don't see the "Embed Map" option

  • Confirm your organization has the map embed add-on enabled

  • Ask an organization admin to verify that map embeds are turned on in Organization > Settings > Map Embeds

  • If neither resolves the issue, contact the OuterSpatial success team

Powered by Plain