BookingMap by VT Labs. Shopify App.

on March 15, 2018

Get the BookingMap application

Recently we have released our new Shopify extension. You can find it in App Store. Also, you can view demo store.

The main idea is turning the standard eCommerce store into map-based service like Booking or Airbnb. 

What will the user get?

  • Google-powered maps for collection and/or product pages.
  • Markers on maps show exact location for your products.
  • Info popups show additional product information such as image, price or address for each marker.
  • User-friendly admin interface allows you to add coordinates and addresses for each product and collection.

Learn how to delight a customer by AR Quick Look in Shopify Store

How to install the app

Click "Activate maps" on the main page to add scripts to the current theme:

Paste the snippet into your "sections/collection-template.liquid" and "sections/product-template.liquid" files where you want your map to appear. Usually this is on the first line(see the screenshots below).

{% include 'bookingmap' %}

How to edit theme:

How to add code to "sections/collection-template.liquid":

How to add code to "sections/product-template.liquid":

If you have an old theme, you can add snippets to "templates/collection.liquid" and "templates/product.liquid":

Usage

Interfaces for products and collection are similar. To set a marker, simply click on the map or type address in search box. To set map zoom, change it on the map via "+/-" buttons. Then click "Save".

You can change the address string manually in "Map Parameters", then click "Save".

To remove the marker click "Delete." It will not affect the product itself.

The form with coordinates and scale is read-only.

>>> Learn how to increase sales and get followers in Shopify store with Instagram feed.

FAQ

  • I'm having difficulty with installation, what should I do?
    Contact [email protected], and we'll be happy to do the install for you.
  • Can I install the BookingMap app on other ecommerce platforms?
    The BookingMap app is currently only supported on the Shopify platform. If you'd like to see it available on other platforms, please send a request to [email protected].
  • What display customizations are available?
    If you have knowledge of theme modifications, you can also adjust the style of the map and info windows, by using your own CSS. Info windows has following classes: "map-info", "map-info-image", "map-info-title", "map-info-price", "map-info-address", "map-info-description".
  • Can I add the map to a product that is not added to a collection?
    There is no such functionality for now.
  • I see "Liquid error (line 1): Could not find asset snippets/bookingmap.liquid" instead of the map.
    Publish your theme and click "Activate Maps" in the app interface.

Support

Contact us if you have any questions or issues with the app.

[email protected]

Create your own shopify store

Share This Article