How to Create a Custom Google Map

Home Elementor How to Create a Custom Google Map

December 22, 2021

 

In this video I will show how to create an advanced custom Google Map for your website.

Normally to pull off a custom map like this you would need to know Javascript, but the team at Crocoblock created a very useful Google Map widget called Advanced Map.

JetElements Plugin:
https://crocoblock.com/plugins/jetelements/?ref=2562&campaign=JetElements

JetElements: How to Create Google Maps API Key:
https://crocoblock.com/knowledge-base/articles/how-to-create-google-map-api-key-to-use-advanced-map-widget-for-elementor/

Marker Icon Downloads:
https://www.flaticon.com/
https://www.mappity.org/
https://sites.google.com/site/gmapsdevelopment/
https://mapicons.mapsmarker.com/
https://iconscout.com/

Google Maps Styling Wizard:
https://mapstyle.withgoogle.com/

Timestamps:

  • 0:00 Introduction
  • 1:30 Add Advanced Map Widget
  • 2:16 Map Settings
  • 5:00 Map Style
  • 5:53 Add Pins to Map
  • 13:55 Style Pins
  • 15:52 Google Maps Styling Wizard

*Some of the links on this page are affiliate links, meaning we may receive a commission if you follow them. This allows us to continue providing free content and educational resources for you. Thank you for supporting our small business!

More Free Resources