What is a Google Map element on Dotcom?
The Google Map element on Dotcom is a block that helps you embed the Google Maps service on your website. By pinning your business address on Google Maps, you can ensure that website visitors find information about your local business address.
To display it on your Dotcom website, you just have to drag and drop the Google Map element to the required position inside the layout and set the location and customizations to suit the theme design.
Steps to use the Google Map element on Dotcom
- On your Dotcom dashboard, navigate to the Themes menu. Select your theme from the My Themes section. Click on the three-dot icon to open a floating menu. Now, click on Edit to open the theme dashboard.
- Here, select the page on which you want to insert the Google Map element from the Select dropdown to open that page on your screen.
- To add Google Maps to your Dotcom website, navigate to the Elements tab. Drag and drop the Google Map element into position on the page layout. Let’s see how to customize it on Dotcom.
- Hover over the dropped Google Map element. It has three sections. You can customize each section individually.
- Edit the Google Map element.
- Edit the Google Map container column.
- Edit the Google Map container row.
- Let’s first see how to edit the Google Map element.
How to edit the Google Map element on Dotcom?
- Click on the edit icon for the Google Map to customize it.
- The customization panel loads on your screen’s right side. Here, you have 2 tabs.
- Content
- Advanced
How to edit the content of the Google Map element on Dotcom?
- Let’s start with the Content tab first to customize the map element.
- In the Form Fields section, enter the location of your business if it is already registered on Google Maps. Otherwise, use the mouse on the map to set the exact location. Select the Satellite display if you don’t want the Default map display. Use + and - on the Google Map display to zoom in or out. You can also adjust the Google Map Zoom with the range slider tool.
- Set the Height by first selecting the size unit in px, %, em, or rem from the dropdown. Next, select the screen type as desktop, tablet, or mobile. Adjust the height using the range slider for each screen type.
How to configure advanced settings for the Google Map element on Dotcom?
- Navigate to the Advanced tab to configure some advanced settings for the Google Map element.
- Once we have completed customizing the Google Map element, let’s start with the customizations for its container column and row.
2. How to edit the Google Map container column on Dotcom?
- Hover over the Google Map element and click on the edit icon for the container column. The Customization panel loads on the right side with three tabs. Items here include-
- Content
- Style
- Advanced
- Customize the container column to suit your branding requirements.
3. How to edit the Google Map container row on Dotcom?
- Hover over the Google Map element and click on the edit icon for the container row. The Customization panel loads on the right side with three tabs.
- Content
- Style
- Advanced
- Customize the container row to match the website theme.
You can perform some general customizations, such as deleting or duplicating the Google Map element or container on Dotcom. That ends our tutorial on how to use the Google Map element on Dotcom.
If you have any questions regarding this topic, we recommend reaching out to our implementation specialist or contacting our support team for further assistance.
For detailed pricing plans, please visit Dotcom’s pricing page. To explore the full range of features and benefits, schedule a demo with our team.