Vorbly <Code>

CODING MADE EASY WITH VORBLY

WIX 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

Google My Maps - Change Privacy Settings

Click "Share" then change access to "Public on the web".

Wix HTML iframe - Google Maps With Location Information

When visitors click on each map marker, they will be able to see location information such as photos, address and reviews.

Google My Maps - Add Multiple Route Markers

Create a custom map by adding addresses to Google My Map. Add directions to create a route (walking, driving or cycling).

1/6

THE ELEMENTS

The Page

HTML iframe: #html1 (embed Google Maps)

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 Wix iframe

HTML iframe

COMMENTS

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

Please complete all required fields.

No comments. Be the first to leave a comment.

WEB DESIGN & DEVELOPMENT SOLUTIONS

GET PROFESSIONAL HELP

CONTACT US