Installation Guide

Add Omnium Maps to your Shopify store

You can add our app to your store from Shopify App Store. After installation, you will have to accept recurring payments for $4.99 per month (the first 7 days are free to use). If you uninstall the app within this trial period, you will not be charged.

At this moment, you should see the dashboard of our app:

Now you're ready to start setting up your maps.

Step 1: Create maps on pages of your store

In Omnium Maps, all maps are linked to the pages where they are displayed.

Start by clicking the "Create a new map" button, pick a page where you want to see your map, and finalize it by clicking the "Create a new map on this page" button:

Now you can configure map options, add or edit locations, save your changes, and preview your map.

Configure Map Options

We have more than 20 customization options for you to choose from:

Add or Edit Locations

The process of adding locations is quite intuitive: just click the "Add location" button, enter your address, add some additional data, and save your location. To edit or delete a location, click on the title of the needed location and edit or remove it from there.

Save your Changes

When you make any changes, please don't forget to save your map by clicking "Save changes" above or below the map.

(Optionally) Preview your map

To preview your map, simply click the "Preview" button that is located to the left of the "Save changes" button. You will see a clean preview of your map (without any styling from your main theme).

Step 2: Provide your Google Maps API key

Once you generate your API key, please add it to the second step of the app's dashboard and click the "Save API Key" button:

Step 3: Adjust the map placement

Finally, you need to let our app know where exactly on the page you want to place your map.

We have 4 different placement modes:

• Automatic (Recommended) - our application will try to determine the positioning automatically;
• Manual (via CSS selector) - you will be able to control positioning with CSS selectors;
• Manual (via Liquid code) - this is an old and somewhat outdated approach;
• None (Hide all maps) - no maps will be rendered (perfect to temporarily hide your maps).

Automatic (Recommended)

In this mode, our application will try to determine the positioning automatically.

Manual (via CSS selector)

In this mode, you can control positioning with CSS selectors.

Different Shopify themes may use different selectors for common sections of the page. Inspect your pages with tools like Chrome DevTools to learn the exact selectors!

Manual (via Liquid code)

This is an old and somewhat outdated approach. It's recommended to use either "auto" or "css" placement instead!

None (Hide all maps)

In this mode, no maps will be rendered. You can use it if you want to temporarily hide your maps!

Please, don't forget to save your placement by clicking the "Save changes" button!

Check the map on your storefront

Open your page on the storefront (as you open all other pages). If everything is done correctly, you should see the map there.