15th August

This tutorial is based on Google Maps widget provided by our plugin Elementor Addon Elements
To use this make sure that you have already installed and activated this plugin.

  • You will have to add google map API key in plugin settings.
  • In Elementor editor screen, you will get “EAE – Google Maps” widget under the category “Elementor Addon Elements”. Drag it inside your preferred location/column.
  • In widget settings, you can add multiple markers. For each marker you can define following values:
    • Latitude and Longitude: Here you can specify coordinates of the location where you want to place the marker. You can use www.latlong.net to get coordinates of your desired location.
    • Info: This will appear in info window when you click on marker icon.
    • Icon: Upload your custom marker icon.
    • Icon: Use it to scale your icon size.

Add Snazzy Map styles to the map

  • You can add Snazzy Map styles to your google map. See demo
  • To add snazzy maps style to your map, you have to copy style code from snazzymaps.com
    Click on any style on Snazzy Maps and copy the Javascript Style Array
  • Now put this javascript style array in “Snazzy Maps” field in widget’s setting.
  • That’s it. Now you will have a styled google map that is completely blended with the theme of your website.

More from this category

Leave a Reply