Interactive Maps

Use interactive maps to showcase brand, attractions, exhibits, events, facilities and more to communicate your value and help guests plan their visit.

Interactive Maps
Jump to a section

April 9, 2025

Interactive maps in LOOP are designed to provide flexibility and scalability. You can have one or more maps, with items, icons, layers, sublayers, zooming, full-screen viewing, search functionality, and overlay content for detailed exploration. While the initial setup may require assistance to ensure graphics and dimensions are correctly configured, ongoing management and updates are simple and intuitive.

(note this is sped up 30% but if you'd like the original that's here on Loom)


Layers, Sublayers, and Image Format

Structure

  1. Base Layer: The foundational image of the map, typically designed by a graphic designer using software like Photoshop or Illustrator.
  2. Transparent Layers: Additional images (e.g., animals, trails, exhibits, paintings, attractions etc) aligned with the base layer to create toggleable overlays.
  3. Sublayers: Optional layers further refine what users can toggle on or off when navigating the map (e.g., specific exhibits, attractions or seasonal changes).

Use Cases

  • Toggle Features: Layers can represent categories like animals, trails, or events, enabling users to customise their map view.
  • Multi-Floor Maps: Solid layers are ideal for attractions like museums or galleries with multiple floors.
  • Seasonal Maps: Create maps for special events (e.g., Christmas or Halloween) by toggling seasonal elements.

Image Format

  • Base and Layers: Images should be exported at the same dimensions to ensure alignment.
  • File Format: Use transparent PNGs for layers and high-quality JPEGs for the base map.

Setting Up the Interactive Map

Initial Setup

  1. Graphics: Work with your designer to create a base map and any required layers.
  2. Dimensions: Specify the height and width of images in LOOP to ensure proper rendering.

Adding Maps to LOOP

  1. Maps Repository: Create a container for maps under Settings.
  2. Add Base Layer: Upload the main map image and configure its dimensions.
  3. Add Layers and Sublayers: Add transparent images as layers or sublayers, then assign points of interest to each.

Adding, Editing, Removing, and Scheduling Updates

Adding

  1. Icons and Items:
    • Use icons for facilities (e.g., toilets, parking).
    • Use items for detailed content (e.g., attraction descriptions with images and text).
  2. Positioning: Drag and drop icons/items onto the map and save their locations.

Editing

  • Update labels, images, and descriptions for existing points by clicking into the icon/item and making changes.

Removing

  • Temporary Removal: Unpublish an icon or item to hide it temporarily.
  • Permanent Removal: Use the Delete option from the actions menu.

Scheduling

  • Use the Schedule option to publish updates at a specific time (e.g., launch a Christmas map on December 1).

How to Add the Map to a Page

  1. Create a New Page: Add a standard page under your desired section (e.g., "Plan Your Visit").
  2. Use the Block Picker:
    • Select the map block from the content section.
    • Choose the map you want to embed from the repository.
  3. Customise Display Settings:
    • Use block settings to apply themes or effects.
    • Adjust map settings (e.g., default zoom level, initial focus point).

Pro Tips

  • Set starting locations or layers to align with specific pages (e.g., zoom in on the tiger exhibit for the "Tiger Enclosure" page).
  • Adjust label thresholds to control when labels appear as users zoom in.

Tour Mode and Adding Tours

Our popular interactive map block now includes a powerful new Tour Mode option to help guide your guests through the key highlights of your attraction.

What Tour Mode Does:

Tour Mode displays a guided experience over your map, allowing guests to click through a sequence of hotspots. Each stop includes:

  • An intro screen (optional)
  • Multiple tour stages with titles, text, and images
  • A final screen to wrap things up

How to Use It:

  • Go to Settings › Maps Repository and open your chosen map
  • Select Highlights Tours and create a new tour (or edit an existing one)\
  • Add hotspots from your map as tour stages — you can override titles, images, and text for each one
  • Drop the map block into a page and enable the tour in the block settings under Highlights Tour

Key Takeaways

  • Plan Your Map Structure: Decide on layers, sublayers, and categories before setup.
  • Think Mobile-First: Ensure the map and content are optimised for mobile users.
  • Leverage Seasonal Maps: Create event-specific maps to enhance visitor engagement.
  • Utilise Scheduling: Pre-schedule updates for seamless transitions between maps.
  • Customisation Matters: Tailor map settings and design for a cohesive user experience.


Interactive maps are a powerful tool to bring your attraction to life online, increase visitor engagement, and showcase the value of your venue. For further assistance with setup or updates, reach out to our team—we’re here to help!

See other latest help articles