Elementor Google Map Extended Pro
If you are looking to enhance your Google Map experience in Elementor such as animation, styles, marker clustering, marker listing or direction, then this is for you. Take a look at the demo below and see what the Elementor Google Map Extended Pro can do and help you in your Project. This is just a beginning, as we are planning to add in more useful features.
Google Map Styles
Show your visitors stunning and beautiful Google Maps. Create your own map styles from SnazzyMap or Google Map Styling Wizard and paste the JSON codes into Elementor Google Map Extended Pro.
Google Map Custom Icon Marker
Upload your own custom icon or image for each marker pin. Easily set custom height and width for individual marker pins.
Google Map Pin Options
We added many marker pin options so that you can play around with to suit your needs. Options such as Trigger Method(On click or On Hover) for opening the InfoWindow, InfoWindow Width, Pin Bounce Animation with adjusted animation duration, Drop Animation on page load and opening all marker pins InfoWindow on load.
Google Map Individual Pin Options
Uploading custom icon for pin marker is just one of them. We also added Label Text with style design, and also the ability to open an URL(open in this window or in a new window) depending on the trigger method selected on the Pin Options and also to open InfoWindow on load – Example, this could be useful if you want to open 2 or 3 important InfoWindows on load out of 10 markers.
InfoWindow Customization
If you don’t like the default Google InfoWindow style, you can always customize your InfoWindow to suit your needs. You can also attached a featured image on every markers.
Google Map Marker Clustering
The marker clustering utility helps you manage multiple markers at different zoom levels. To be precise, the ‘markers’ are actually ‘items’ at this point, and only become ‘Markers’ when they’re rendered.
Google Map Marker Listing
Using the Marker Listing will display all your markers in a table list below or above your Map. Clicking on the relavant marker listing will also show up on the map with the ability to open the infoWindow and map zoom. You can also style the table header and content.
| Title | Description |
|---|---|
 Marina Bay Sands |
10 Bayfront Avenue, Singapore 018956 |
 Mount Faber Park |
One of the oldest parks in Singapore, Mount Faber Park is a popular tourist destination |
 Clarke Quay |
This is Clarke Quay. The Singapore nightlife where you can enjoy by the river. |
|
Sentosa Cove |
Where some of the rich and the famous live. |
Google Map Directions
Using the Google Map Direction will allow your visitors to search from their current location to the selected marker. Clicking on the location icon will get visitors’ current location and route to the selected marker with different mode of route such as Driving, Walking, Cycling and Transit. Style and customizing icons and buttons easily.
You can also show text direction so that you visitors have a clearer direction.
Note: Since this is in Singapore, I would suggest typing the address “Singapore Changi Airport” to see how direction route you through.
| Title | Description | Direction |
|---|---|---|
|
Marina Bay Sands |
10 Bayfront Avenue, Singapore 018956 | Go here |
|
Mount Faber Park |
One of the oldest parks in Singapore, Mount Faber Park is a popular tourist destination | Go here |
|
Clarke Quay |
This is Clarke Quay. The Singapore nightlife where you can enjoy by the river. | Go here |
|
Sentosa Cove |
Where some of the rich and the famous live. | Go here |
Elementor Google Map Extended PRO Styling
