Vorbly Code | HTML IFRAME GOOGLE MAPS WITH TRAVEL ROUTE

Vorbly <Code>

CODING MADE EASY WITH VORBLY

HTML IFRAME GOOGLE MAPS WITH TRAVEL ROUTE

Need a Google Map with a travel route? This tutorial will show you how to add a Google Map with travel route using HTML iframe. We will provide you with the webpage elements and sample codes required to implement this feature.

THE DEMO

1/6

THE ELEMENTS

The Page

Add a HTML iframe to your website.

THE CODE

Generating iframe code

1. Go to Google My Maps

2. Add map markers by entering your addresses into the search bar then "+ Add to map"

3. Add travel route by clicking "add directions" icon and entering map markers in order

4. Change privacy settings: Click "Share" > Change acces to "Public on the web"

5. Go to Settings > Embed on my site

6. Copy the iframe code to your website's HTML iframe

HTML iframe

<iframe src="https://www.google.com/maps/d/u/0/embed?mid=1-YOUR_MAP_CODE" width="960" height="410"></iframe>

COMMENTS

I'm a paragraph. Click here to add your own text and edit me. It's easy.

No comments. Be the first to leave a comment.

Can I create iframe with GPS coordinates into WiXs' site ?

Sami

Mar 12, 2019

1

Hi Sami,

Welcome back! Its good to hear from you again.

If you have a static location (fixed GPS coordinates) you can add a HTML iframe to your Wix site.

If you have GPS coordinates (e.g. latitude and longitude) in your database (for dynamic pages), you should add a Google Maps element and refer to this tutorial instead.

https://www.vorbly.com/Vorbly-Code/WIX-CODE-GOOGLE-MAPS-LOCATION-FROM-DATABASE

Hope this answers your question.

Ben (Vorbly)

Mar 12, 2019

1

Can you help me with this code? Thank you.

Terry

Apr 08, 2019

0

Hi Terry,

Would you be able to provide more details about your project and your current code?

Thank you.

Ben (Vorbly)

Apr 08, 2019

0

WEB DESIGN & DEVELOPMENT SOLUTIONS

GET PROFESSIONAL HELP