OpenStreetMap Element

OpenStreetMaps is an open-source equivalent to Google Maps. The OpenStreetMaps Element allows you to place a map anywhere in your content. Check out the OpenStreetMap website for more details on this project.

Watch the video below for a visual overview of the Element, view the Avada OpenStreetMap Element page for live examples, and read on to see the complete list of options.

The OpenStreetMap Element is a parent and child element, which allows you to place one or more pins on a map. The Children tab contains the individual items, while the other tabs are Parent Options, and affect the whole series of info items. You can start either by adding Child items or customizing the parent options. These cover the functionality and style of the element as a whole.

To edit the child items, go to the Children tab and click the pencil icon to edit the existing item. The Child Item Options Panel appears. The main options here are the longitude and latitude fields, which place the pin on the map. You can also search for a specific address, but the Longitude and latitude will always be the most accurate. When a pin is active, you can drag its position around the map, and customize the pins with labels and additional details.

If you want multiple pins on a map, you can then duplicate existing, or create new, content boxes by clicking on the Clone Item icon, or the + Add Marker button, respectively. On the General tab, you set the size and zoom level of the map and determine which controls will be available to the user. There is also a Design tab for further customization and an Extras tab for Element animation. Read below for a detailed description of all element options.