Made in Webflow

CMS Google Maps Markers

site profile thumbnail


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, generate a JavaScript Maps API Key, and restrict its access (useful tutorial: 2. In the head script, add this script <script src="" type="text/javascript"></script> and replace the placeholder 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="latitude". For the name, you can add maps="name" as an attribute. 4. Publish and enjoy. Video tutorial coming soon.
Feeling inspired?If this Made In Webflow site sparked some inspo, why not get started on a project of your own? Clone a site, purchase a template or start building from scratch.

More by PixelMakers

See profile
View details
Quote / Price Calculator