Embed Youtube Video into Google Maps

How To Embed Your Youtube Video into Google Maps

We had over 700 people register for the Youtube Video and Blogging Classes we held over at ActiveRain University this last month. In these sessions, we covered how to create and use video more effectively for your Blogs and websites. We shared some cool tips and important tools regarding the use of video and how to get the most out of Youtube’s new look and their added features.

The one thing we didn’t have time to teach was “How To Embed Your Youtube Video into Google Maps”, then How to embed the “Interactive Map” with your video into a Blog post or website.

SO HERE’S THE DETAILED INSTRUCTIONS FOR THE MANY OF YOU WHO ASKED:You’ll need a Youtube account, if you don’t have one, set one up, it’s FREE.  You’ll also need a Google Account to sign in and save your maps. If you don’t have one, set one up, it’s FREE too.

Step 1: Upload your video to Youtube.com

Step 2: Select the video you want to embed into Google Maps

Step 3: Copy the embed HTML code from the Youtube Video
(it should look something like this)

Step 4: Go to maps.google.com and click the “My Maps” Link

Step 5: Click on the “Create New Map” link

Step 6: Search the map to find the exact location where you want your video to appear
(zoom in close to find exact location)

Step 7: In the “Edit” mode, click on the placemark icon and place it on the map

Step 8: Click on the “edit HTML” link and add youtube embed code into description box.

Step 9: Give your marker and description box a “Title” and click “ok” and then “Done

Step 10: Your video will now appear on Google Maps and can also be viewed on Google Earth.

Now, to embed the saved Video and saved Map into your Blog or website, click on the “Link” located in the upper right corner and copy the embed code from Google Maps.  Next, place the embed code in your Blog post (using the HTML tab) or on your website and save.  This will put the interactive map including the video into your post or on your web-page.  Visitors can now watch the video from within your interactive map, and never even leave your post or site.

The best part is that even if you don’t embed the iframe map into your Blog or website, the video is still attached to Google Maps and can be viewed by anyone who clicks on the video from within the Google Maps page.  Here’s what the completed project will look like in a Blog Post.  Try doing this with your community videos, your virtual tours, your travel videos, any video you’ve created that you want to show up on Google Maps.

Be sure to turn down your volume if you hit play, this video is pretty loud.

View The Black Hole – The Glory Hole in a larger map

Comments (7)

  1. Gwen

    Hi !
    It doesn’t work ! I don’t get it !
    After I add youtube embed code into description box, nothing appears … 🙁
    or something has changed with the new version of google… ?

    • Brad Andersohn

      Hi Gwen – make sure you’re using the most current web browser available and that you use the old embed code from Youtube and not the new iFrame code that’s offered. I haven’t tried this with iFrames and not sure it would work. Let me know. 🙂

      • Suleiman

        Hi Brad, I have the same problem as Gwen. I am using the old embed code, for example:

        and using latest version of Chrome.

        After pasting the code in edit link tab of description box, clicking ok/save makes the code disappear.

        • Brad Andersohn

          Hmm.. Google changes things so quickly sometimes, I’ll have to research this and see what might have possibly changed.

          • Cathy McLeer

            Have you found a solution to this yet? I tried it and the video appeared, but just the bottom half. Then when I went back in to try to adjust things in my edit box (deleted some photos and add spaces) now it won’t show up at all. I tried both iframes and the old embed code.

          • Brad Andersohn

            Cathy – they have made so many changes to all their platforms, I don’t have an immediate solution, but I will research this and try to find an alternate process to accomplish the same goal. Thanks for your comment.

  2. Pingback: Embed video in Google Map | Interface Design & Digital Aesthetics + Advanced Media Technologies

Leave a comment