Home / Widgets

Map Widget

Unknown Author

Last updated on Nov 25, 2024

The Map widget is a tool that showcases geographic maps and location-based data, empowering users to engage with the map through zooming and other interactive features. This enriches the user experience and presents essential location-related details in a visually pleasing manner. Use the widget for websites in various industries, including travel, real estate, etc., or add it to your website to indicate delivery service locations or event venues.

Adding a Map Widget

To add a Map widget:

  1. Go to Visual Editor by selecting Advanced mode from the mode switcher on the Dashboard top panel, or navigate to Dashboard > Channels > Advanced.
  2. Navigate to the required page.
  3. Open the Widgets list on the left panel.

  4. Type the widget name in the search bar, or expand the Advanced group to access the Map widget.

  5. Drag and drop the Map widget onto the required area of the Layout Canvas.

Upon placement the widget appears with the default size and styling, which you can customize.

Configuring the Map Widget

To design the appearance and behavior of the Map widget, activate the Property Panel of the widget by clicking it to access the widget Styles, Content, and Settings.

  1. Go to the widget Styles to configure its general styling features (see Global Styles) to achieve the desired visual and functional outcomes.
    • Customize the widget-specific feature General:
      • Choose the Map Type (Hybrid, Roadmap, Satellite, and Terrain) according to the specific information or visualization needed for your website.
      • Select the Map Style (Default, Aubergine, Dark, Night, Retro, and Silver) for the required visual representations of the geographic map.
      • Set the required Zoom Level with higher numbers indicating a closer and more detailed view, and lower numbers for a broader and more encompassing view.

      • Activate the Google Map Settings toggle to display the Pegman and +/- buttons on the map to allow your users to access Street View and zoom in (+) and out (-).

  2. Go to the widget Content to add the required locations on your map:
    • Add the Location Name, which is visible to only you for differentiating the locations, in case you have more than one.
    • Use the Address search bar to look for the specific location you want to add. You can enter the name of the place, address, or coordinates.
    • The Latitude and Longitude values are automatically filled in.

Note: You can add an unlimited number of locations.

3. Go to Settings and expand Visibility to modify the element visibility on your website. Select who can view the element according to the customer's location, session status, used device type, browser, language preference, etc. (see Visibility Settings). 

💡 If you have questions or concerns, contact us directly via the Live Chat box in the lower right corner. Our Support Team will provide you with top-notch quality support 24/7.