Map Element

Created by Christi Norfleet, Modified on Mon, 27 Mar, 2023 at 7:41 AM by Christi Norfleet

Map

You can use the "Map" Element when you want to include your Business location in tour website.

General Settings

Element Name/Title

Here you will see the default name/title of the Edit option you are working on. You can decide to leave at that or rename it.

Text Align

You can move your text in different positions as you deem fit, you can position it to the Left, Center, Right, or as Justified.

Map Option

Open Search Box

When you click on the "Open Search Box" it opens the Map page and allows you to;

  1. Input your business location and pin the exact point with the marker.
  2. You can also decide to view your search using Map or Satelite,
  3. Zoom in and out, and
  4. You can also make it a full screen.

Map Type

Here you can select the type of map you will like to use in viewing your location.


Marker Color

You can change the color of your Marker by selecting the color you want. If you have a particular color code you would like to use, you can input it in the space provided.


Zoom

You can zoom in on the particular location your marker is on by moving the bar towards the right to increase the number.


Horizontal Width and Vertical Height (max 640)

You can adjust the height and width of your map by inputting the size number you want. The maximum height and width you can go are 640.


Retina (2x)

The "Retina" is a quick way to increase the height and width of the map. When it is toggled on, it automatically doubles the original size of the map. **** For instance, if the original height and width are 300 and 200 respectively and you toggle on the Retina the sizes changes to 600 and 400 respectively.

New Tab

When you toggle on the "New Tab", this allows visitors to open Google Map on a new tab once they click on any part on the map. If it's not toggled on, the google map will only load on the SEO page without tranferring to a new page.


Advanced Settings

Visibility

You can decide if you want this particular Edit option to be visible on only mobile devices, desktops, or both by clicking on it to highlight the icon.



Custom Class

Input your custom class here.


CSS Selector

If you need to copy the Custom CSS, just click on the "Copy" icon on the right side of the reference code.

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select at least one of the reasons

Feedback sent

We appreciate your effort and will try to fix the article