Adding Google Maps to Your Digily Link Page

Created on 21 May, 2024 • 👉 Blog English • 89 views • 1 minutes read

We'll walk you through step-by-step how you can add Google Maps using Digily Link's Custom HTML Block feature.

Managing and enhancing your digital presence using Digily Link can be greatly improved by displaying your business or a specific location via Google Maps. In this blog post, we'll guide you step-by-step on how to add Google Maps using the Custom HTML Block feature of Digily Link. Additionally, we'll share the necessary responsive code to ensure the map fits perfectly on the page.

Step 1: Add a Digily Link Block

First, log into your Digily Link admin panel and follow these steps to add a blog:

Click on the Add Block button.
From the menu that appears, select Add New Digily Link Block.

Step 2: Create a Custom HTML Block

After creating a new Digily Link block, you'll need to select the Custom HTML block. This block allows you to add the Google Maps iframe code to your page. Follow these steps:

Click on the Custom HTML option.
Switch to the HTML editor that appears.

Step 3: Get the Google Maps iframe Code

Determine the location you want to share on Google Maps and follow these steps:

Open Google Maps and search for the location you want to share.
Once you find the location, click on the menu icon in the upper left corner of the screen and select "Share."
In the window that opens, switch to the "Embed a map" tab and copy the iframe code provided.

Step 4: Paste the iframe Code into the Custom HTML Block

Paste the iframe code you obtained into the Custom HTML block in Digily Link. However, to ensure the code fits perfectly on the page, it needs to be made responsive. Use the following responsive code:

<div style="position: relative; padding-bottom: 0%; height: 0; overflow: hidden; max-width: 100%; height: auto;">

PLACE YOUR IFRAME CODE IN THIS FIELD.

</div>

Step 5: Replace with Your Own iframe Code

In the above code, replace YOUR_IFRAME_CODE_HERE with the iframe code you obtained. By following these steps, your map will fit perfectly on the page and be displayed correctly on all devices.

By following these steps, you can add Google Maps to your Digily Link page and easily share your location with your visitors. Using the responsive code ensures that your map will look perfect on any device. With Digily Link's Custom HTML Block, you can create more professional and user-friendly pages.