This clonable is for anyone that needs a dynamic, CMS-controlled Google Maps on their website. It requires an API key and a bit of JavaScript & custom attributes knowledge.
How to use this clonable:
1. Go to https://mapsplatform.google.com/, generate a JavaScript Maps API Key, and restrict its access (useful tutorial: https://www.youtube.com/watch?v=2_HZObVbe-g)
2. In the head script, replace the code from key=... with your API key;
3. Create 2 new number parameters in your CMS collection: latitude and longitude. Display these fields in your project, you can also hide them from the user. On the longitude field, add maps="longitude". On the latitude field, add maps="latidude". For the name, you can add maps="name" as an attribute.
4. Publish and enjoy.
Video tutorial coming soon.
Tags from Webflow:
googlemaps, maps, cms, webflowcms, markers
The best Webflow projects handpicked & delivered.
We search the entire Webflow showcase to find the most clone-worthy websites. The kind of sites that make you say "wait... this is free?"
Unsubscribe anytime. No spam.
Booyah! The first newsletter will go out early next week.
Oops! Something went wrong while submitting the form.
0 Comments