Shopify Installation | Documentation

Shopify is a platform that makes it easy to create an ecommerce store. Adding a map to your store can be a great way to make your store more attractive and build social proof. There are two ways you can add our maps to your Shopify Store. The following details the differences between the two methods.

1. Install using our Shopify App
   • Very easy installation process
   • Can automatically display store orders
   • US, World, and Canada maps available
   • Small recurring monthly charge through Shopify


2. Install Manually
   • Slightly more involved installation process
   • All maps we sell can be installed
   • One-time license fee at Simplemaps.com (future updates optional)

Based on your needs, choose one of the two methods.

Shopify App (Option A)

To install a map using our Shopify App, do the following:

1. Go to our Shopify App page.

2. Click "Get" to install the App.

3. Customize your map by filling out the options on the "Customize" tab

   

4. View your map on the "Preview" tab

5. Install your map by pasting the code

   <div id="simplemaps"></div>

   into a page (Online Store --> Pages --> Choose Page --> Show HTML)

   

Manual Installation (Option B)

1. First, choose the map you want to install
   HTML5 World Map HTML5 US Map HTML5 Canada Map HTML5 North America Map HTML5 County Map HTML5 State Map HTML5 Custom Map HTML5 Europe Map HTML5 UK Map HTML5 Australia Map HTML5 Country Map

2. After you have customized your map, you'll have two files: worldmap.js and mapdata.js

3. Upload these files to your Shopify Store (Settings --> Files --> Upload Files)

   

4. Copy down the full urls where both files have been uploaded

   

5. Install your map by pasting the code

   <script type="text/javascript" src="https://cdn.shopify.com/s/files/.../mapdata.js"></script>		
   <script  type="text/javascript" src="https://cdn.shopify.com/s/files/.../worldmap.js"></script>   
   <div id="map"></div>

   into a page (Online Store --> Pages --> Choose Page --> Show HTML) where you replace the example urls with the full urls from Step 4.

   

6. Save the page. Your map should be visible.