Step 1: Login to your account.
You can login to your account here.
If you have not created an account yet, take 2 minutes to start your 14-day free trial.
Step 2: Customize your map.
Once logged in, navigate to the Map page in the left navbar.
In the Appearance section, you can change the colors of the elements of the map, the fonts, etc. Everything you need to match your brand style.
In the Configuration section, you can change the map theme and the default location that the map uses when it loads in your website or application.
Once, you have finished customizing your map, click on Publish changes.
Step 3: Create an API Key.
Navigate to the Integration page in the left navbar.
Click on the + Add key button.
Name your key however you like. (Testing, Production, etc).
Copy your key and store somewhere safe, for security reasons you will not be able to see it again.
Step 4: Embed the map in your website or application.
Copy the code snippet from the Integration page.
Paste the code snippet in the checkout page of your website or application.
When pasting, replace the following values in the variables of the code snippet:
#your-target-container: replace this value with the selector/name of the container where you want to embed the map in your website or application.
YOUR_API_KEY: Replace this value with the API key you created in step 3. This enables the map and its core features to load.
window.yourCallback: Replace this value with your callback function.
To learn how to create your callback function or use one of our existing callback functions, please visit this article.
The callback function is very important, it is what enables you to store the customer locations in your website or application.
Step 5: Start receiving customer delivery locations.
After changing the variables in the previous step, the map should load and work correctly in your store's checkout page.
Ready! Start obtaining customer location data!
If you run into any trouble while setting up your map, please do not hesitate to contact us.