Using a Google Maps widget can help consumers locate your business and improve the overall user experience. Most websites will utilize Google Maps on their contact page to identify their actual locations. By doing so, you will save clients the process of opening maps in another window and pasting over the address. They can simply click on your map pinned address and get directions.
Add the Google Map section to your page
Step 1: From the EcomSolid Dashboard, head to the Theme Editor or Page Editor.
Step 2: Access the Library from the top bar of the Editor Page.
Next, navigate to Section > Extend. Choose your preferred section and hit “Insert” to add it to your Editor.
After that, you will find the section added to your Editor. Click on the section to start configuring the settings, including the Content and Design tab.
Configure the Content tab
Section Name: Input the text into the field for the preferred label of your map.
Search Location: Input your address/location into the field. Your map will include a pin dropped at this location.
Zoom Level: Select the zoom level of the map from the drop-down. You may reduce the zoom level to focus your map directly on your business location. Otherwise, choose a higher level to show the surrounding area.
Configure the Design Tab
Navigate to the Design tab to style your map further.
Use the slider or input the number into the box for your preferred value for the map’s height.
Select a color or enter a hex color code for the map’s label.
Input the number for the font size you want for the map’s label.
Padding and Margin
The Padding and Margin parameters have four empty boxes that allow you to fill in the value for four directions: top – right – bottom – left.
Select the animation for your map from the drop-down. You can click on “Preview” to see how the animation works on the live page.