# How to use Google Maps on the pages?

Siteoly supports usage of Google Maps on Detailed Pages and on Home Page (Below the Header).

### How to use Google Maps on Detailed Pages?

Get your Google Maps Embed code that looks as below.&#x20;

```
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3349.9379389868927!2d-97.04252388501035!3d32.89980908093507!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x864c2a660d222aa7%3A0x73323f5e067d201c!2sDallas%2FFort%20Worth%20International%20Airport!5e0!3m2!1sen!2sin!4v1650602306789!5m2!1sen!2sin" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
```

1. Go to your 'DetailedPages' sheet in Google Sheet and add your code inside the Markdown/HTML code as below in Column D. See sample screenshot as below.

![](https://2417500603-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MBSmybPoMOkUYIdcSj1%2Fuploads%2F90rzo20GkmTmPBT8h1tE%2FSly-GoogleMaps-DetailedPages.png?alt=media\&token=0f53e1b2-94b1-495f-8b84-dcfc415a9b8c)

Now, use 'live test' and check the Detailed Page to see the Google Map on the Detailed page as below.

![](https://2417500603-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MBSmybPoMOkUYIdcSj1%2Fuploads%2FpEC3UOYSm3LXCRoMZk9o%2FSly-GoogleMaps-DetailedPage-Sample.png?alt=media\&token=c2ad179c-a03e-41a8-81bc-ed335e5f14e7)

### How to use Google Maps on Home Page?

Get your Google Maps Embed code that looks as below.&#x20;

```
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3349.9379389868927!2d-97.04252388501035!3d32.89980908093507!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x864c2a660d222aa7%3A0x73323f5e067d201c!2sDallas%2FFort%20Worth%20International%20Airport!5e0!3m2!1sen!2sin!4v1650602306789!5m2!1sen!2sin" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
```

1. Go to your 'Body-Text' sheet in Google Sheet and add your code inside the Markdown/HTML code as below in Column C. See sample screenshot as below.

![](https://2417500603-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MBSmybPoMOkUYIdcSj1%2Fuploads%2FkPNZYwsvty4UZvAjRXr3%2FSly-GoogleMaps-HomePage-BodyText.png?alt=media\&token=44b25c60-6c96-441a-aff8-33e3158a1c20)

{% hint style="warning" %}
**For the 'Body-Text' to work**, always makes sure the 'Display Text Content' (Row 10) is set to 'Yes' in 'Body' sheet.&#x20;
{% endhint %}

Now, use 'live test' and check the Home Page to see the Google Map on the Home Page under the Header as below.

![](https://2417500603-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MBSmybPoMOkUYIdcSj1%2Fuploads%2FwVN5SWruStGwGf5oivg0%2FSly-GoogleMaps-HomePage-Sample.png?alt=media\&token=abc4e0ee-c108-4119-8362-d0f3a19668ca)

{% hint style="info" %}
Note: Always use 'live test' link to verify the latest changes.
{% endhint %}
