How do I embed Google Maps into an itinerary?
One of the great features of Safari Portal is that it will always automatically generate a custom map that automatically pins any property locations included in an itinerary and any properties and/or areas included as pages in a lookbook.
But what if you wanted to include a custom map? Perhaps you'd like to include walking directions from a hotel to a restaurant, or a route for a walking tour or a cruise. Or maybe you use Google's my maps feature to create custom maps with points of interest or locations for activities or tours. Safari Portal gives you utmost flexibility to embed custom Google maps through the iFrame element on the Element Library.
1. Go to https://www.google.com/maps to create a Google Map by adding your destinations and selecting your route and mode of transport.
2. Once you have configured the map the way you need, click the hamburger menu in the top right and then click the Share icon.
3. Click Embed A Map and copy the HTML. Now navigate back to Safari Portal.
4 Launch the Element Library from within any content page, lookbook, itinerary, or guest portal, and select the iFrame Element. Hint: Click the ’+’ that appears on the blue line.
5. Select Google Maps from the dropdown menu.
6. Paste your Google Maps HTML in the box below. Click Insert.
And there we go…as simple as that!
P.S. Don’t forget to click Save.
We're so excited that you're customizing your itinerary like this! Keep up the awesome work 🥳
📌 Pro tip: You can also embed Google My Maps using the iFrame element and you can customize the map colors, add points of interest, and more there (it gives you a bit more flexibility than regular maps.google.com).
📽️ Another Pro tip! You can also use the iFrame element to embed TripClip videos.