How to fix maps not appearing on the storefront

Troubleshoot and resolve common issues preventing your maps from displaying on your storefront.

Important Note About Propagation Time

Before troubleshooting, please wait 1-2 minutes after making any changes (creating maps, updating settings, or adjusting placement). It takes a short time for changes to propagate to your live storefront.

Issue 1: Map Created on the Wrong Page

Each map in Omnium Maps is linked to a specific page in your Shopify store. If you're viewing a different page than the one you assigned to your map, the map won't appear there.

Check which page your map is assigned to:

Open the Omnium Maps app in your Shopify admin
Go to the dashboard where you see all your maps
Look at the page name listed under each map

Omnium Maps dashboard showing a list of maps with their assigned Shopify pages

Make sure you're visiting the exact page that's listed. For example, if your map is created on "pages/store-locator", navigating to "pages/where-to-buy" won't show the map.

Issue 2: "Omnium Maps" app embed Not Activated

For maps to display on your store, the "Omnium Maps" app embed must be activated in your current theme.

Critical Requirement

Without the app embed activated, your maps will not render on your storefront - even if everything else is configured correctly.

If you recently switched to a new theme, you must reactivate the app embed for that theme.

To activate it, follow these steps:

Open the Omnium Maps app in your Shopify admin
Navigate to Step 3 on the dashboard and follow guidance there

Activate button in Omnium Maps dashboard to enable app embed in Shopify theme editor

Issue 3: Automatic Placement Not Working

Omnium Maps uses automatic placement by default, which works seamlessly with the majority of Shopify themes. However, some themes have non-standard page structures that prevent automatic placement from working correctly.

Signs that automatic placement might not be working:

The map doesn't appear at all on the page
The map appears in an unexpected location (e.g., header, footer, or sidebar)
The map overlaps with other page content

Before switching to manual placement mode, try adjusting the automatic placement using a simple HTML code snippet. This lets you control exactly where your map appears while keeping automatic placement active.

Copy this code snippet, which tells Omnium Maps exactly where to render your map:

<div develic-map-container=""></div>

Navigate to your page in the Shopify admin and switch to the HTML editor (look for a </> or "Show HTML" button). Paste the snippet where you want the map to appear.

Shopify page editor showing HTML button to access code view for inserting map placement code

HTML code editor in Shopify showing develic-map-container snippet for custom map placement

If adjusting automatic placement with the HTML snippet doesn't work for your theme, you can switch to one of two manual placement modes.

Option A: CSS Selector Placement

This method targets a specific HTML element on your page using CSS selectors.

Best for: Users comfortable with basic HTML/CSS or those following our documentation.

Example: #page-content .main-content

Option B: Liquid Template Placement

This method involves inserting a Liquid code snippet directly into your theme's template files.

Best for: Users comfortable editing theme code or working with developers.

Note: Provides the most precise control over map placement.

Need Additional Help?

Contact our support team and we'll help you diagnose and resolve the issue.