Beautify your contact pages with one of the most customizable yet lightweight solutions available. This extension is a gateway to the Google Maps service that allows you to have maps that fit your design colors.
- Responsive. - Multi-addresses supported. - Every element on the map has its own customization. - Map controls configuration. - Optional: Multiple custom images for the markers. - Tooltips and info windows for the markers. - Multi-instance. - Highly-optimized markup output code. - Maximum compatibility.
* Just a brief about some of the changes that were made lately...
* New in version 18.104.22.168
- Infowindow: Improved caption and content alignment.
* New in version 22.214.171.124
- Resolved a resize/relocation sporadic issue on older browsers and/or slower platforms due to changes in the Google's API. - New five built-in styles. - Minor code tweaks.
* New in version 1.0.2
- Predefined styles; 15 built-in elegant styles included to make the instance even easier and quicker to setup. - Minor markup tweaks.
* New in version 126.96.36.199
- Handling gestures modes; improves navigability on mobiles (prevents collisions when dragging the page and/or the map). - Clickable icons option; specifies if map icons are clickable or not (usually a POI is a clickable icon).
* New in version 1.0.1
- Addresses: Resolved a bad parameter conformation in case of using the default address marker. - Infowindow: Improved optional image styling. - Infowindow: Improved optional 'read more' button styling. - Infowindow: Improved optional framework styling.
* New in version 188.8.131.52
- Improved code to avoid 'may be blocked code by browser on poor network connectivity' message on Chrome 52+. - Improved [missing] API key handling on testing environment.
* New in version 184.108.40.206
- Optionally, an infowindow can have a custom subtle framework to differentiate the own addresses from the other map information elements. - API key supported for professional productions, avoiding the "missing key" console warning (not relevant during development stages). - Standard or secured connection modes.
* New in version 220.127.116.11
- Optionally, an infowindow can automatically be opened once the map has been loaded.
* New in version 18.104.22.168
- Address markers can also have links (besides the infowindow). - Improved target handling. - Improved startup on advanced scenarios. - Improved compatibility with [rz] Adaptive Framework, [rz] Stretch Layers and [rz] Block Framework.
* New in version 22.214.171.124
- Optional size definition for the custom image in markers to allow a better implementation on Retina-based devices. - Optional size definition for the infowindow image to allow a better implementation on Retina-based devices.
* New in version 126.96.36.199
- Additional workaround for refresh/startup issues on slower devices and heavy/advanced pages. - Optionally, also an external styles editor or a code generator can be used (like mapstylr.com or snazzymaps.com; maybe others as well) and just copy-paste the resulting code within the extension (see 'Elements: resource' category).
* New in version 188.8.131.52
- Fixed an alignment issue in different breakpoints (when using an instance within a layer). - Improved backward support.
* New in version 184.108.40.206
- Horizontal and vertical offset for the main/first address centering. - New default values based on the new style of the Google Maps elements.
* New in version 220.127.116.11
- Filter control feature filters different areas of a multi-addresses map. - Common addresses for different areas are supported and managed by the filter control. - Highly customizable to fit the design scheme. - Improved infowindow.
How to use?
1. Drag and drop a layer and optionally make it resizable (via relative sizes or breakpoints). 2. Drag and drop the [rz] Styled gMaps within that layer. 3. Open the extension properties dialog and setup the colors you want for the desired map elements. 4. Optionally, select the controls you want them visible on the map and setup their position and appearance. 5. Enter the address(es) you need and, optionally, the custom images for each address. 6. Preview or publish.
How to make a "full-screen" map?
1. Drag and drop the extension in the workspace. 2. Set it up as usual. 3. Preview or publish.