Google Maps Element allows you to create a multi-location map fo your Joomla website. It gives you full control over the map configurations, map types, themes, styles and much more.
A quick lookout about the element is below:
All the options related to element styling & configuration are under the main General tab.
Firstly we have the Locations tab:
- Locations– Add single to multiple on your Google Map. Each location has its own settings, whose options are as follows:-
- Search Location– search the location you wish to add on the map in the search bar provided.
- Longitude/ Latitude– If you cannot find the exact location then add its coordinates in the latitude & longitude fields respectively.
- Address Title– Add the address title of your location, optional.
- Display Info Window– Choose if you would like to show a info window about your location and how, whether On Click or On Page Load or just simply keep it None.
- Add Description– If you choose display the info window then add a description about the location.
- Marker Icon– You can choose to add a custom marker for your location in order to highlight it on the map.
Next tab is of the Map Options, that has the following options:-
- Map Type– Choose how you want to show the map view whether a Road Map, Terrain, Hybrid or Satellite view.
- Map Theme– Depending upon the type select the map’s theme from the options available.
- Marker Animation– You can even set animation to the markers on the map, Drop or Bounce.
- Map Zoom– Set how much zoom you would like to show on the map.
- Map Height– Set the height of the map with respect to the page.
Next tab is of Map Controls to manage the controls on the map, that has these options:-
- Street View Control– Enable or disable the street view to map view on toggle.
- Map Type Controls– Toggle between whether to show the map type or not.
- Zoom on Scroll– Allow to zoom in to the map on mouse scroll
- Zoom Control– Enable or disable the zoom controls on the map.
- Full-screen Control– Allow to show the map on full screen view on frontend.
Next tab has the options for styling the info window of the locations added that is under the Info Window Options:-
- Max Width– Set the width of the maximum width of the popup window.
- Padding– Adjust the content padding within the popup.
- Background Color– Add popup’s background color to make to look more appealing.
- Space Between– Adjust the spacing between the Address title & address description.
- Address Title Styling– Add the text color & style to the location title.
- Address Description Styling– Style the location’s description to make it more attractive & readable.
- Border Styling Options– Style the popup window with different border styles & box shadows.
