Embed your Google Earth Project in your Website

The Embed Gadget tool needed to complete this tutorial is no longer available. It is still possible to embed KMLs using the Google Earth API; however, note that this API will be deprecated in December 2015. Please consider using another tool to host and share your Google Earth work on the web, such as My Maps, Tour Builder or Google Maps API.

You can embed your Google Earth Project in your website or blog by using the Embed KML gadget! This tutorial will guide you through how to embed your Google Earth project in your website or blog using the Embed KML gadget.

In this exercise, we're going to embed a Google Earth project of Women for Women International. You can also choose your favorite example from the Showcase to insert into the gadget.

This video demonstrates how to embed Google Earth in your website or blog (0:32).

Prerequisites

  • Absolutely no programming skills needed!
  • You will need Google Earth installed on your computer. Download the latest version here. (It's free!)

Let's get started!

1. Open Google Earth.

2. If you would like to embed your own Google Earth KML file onto your website, upload your file onto your web server, so that it is accessible online. You can also upload your file to your website or use other web pages like Google Sites. To learn how to upload your KML on Google Sites, check out this User Guide article. For more information about saving your KML or KMZ file, see the Packaging Content as a KMZ tutorial.

Use the Embed KML gadget

1. Click here to go to the Embed KML gadget.

2. Under the Display Settings, enter a name for your embed window, set the size for your Earth window, and choose a frame color.

3. Under the Gadget Settings, enter the URL link to the KMZ file on the web. For this example, enter the following URL:

http://earth.google.com/gallery/kmz/women_for_women.kmz

4 Select a view mode (Earth or Maps), and select how you want the embedded map to initially load and if you want to show 3D buildings, roads, borders, and other data.

5. Click the Get the Code button.

6. Select the code at the bottom of the Embed KML Gadget, and copy it.

Use the Embed Tour gadget

1. Click here to go to the Embed Tour gadget.

2. Under the Display Settings, enter a name for your embed window, set the size for your Earth window, and choose a frame color.

3. Under the Gadget Settings, enter the URL link to the KMZ file (with a tour included) on the web. For this example, enter the following URL:

http://mw1.google.com/mw-earth-vectordb/blog/plugin_tours/lake_chad_tour.kmz

4. Select a view mode (Earth or Maps), and select how you want the embedded map to initially load and if you want to show 3D buildings, roads, borders, and other data.

5. Click the Get the Code button.

6. Select the code at the bottom of the Embed Tour Gadget, and copy it.

Embed Google Earth in a website

In this example, we are using Blogger as a hosting mechanism. You can use other web hosting services if you wish. Remember: the best place to embed the map is on your website!

1. Go to blogger.com, and log in with your Google account.

2. Create a new post, and paste the HTML code from the Embed KML Gadget into the post window.

3. Click Publish Post and view the blog. If you have the Google Earth Plug-in installed on your computer, your Google Earth project will appear on your blog!

Here is a published blog post of the Women for Women International Google Earth project, created with the Embed KML gadget:

Here is a published blog post of UNEP's Lake Chad Google Earth tour, created with the Embed Tour gadget:

Discussion & feedback

Have questions about this tutorial? Want to give us some feedback? Visit the Google Earth Outreach Discussion Group to discuss it with others.

What's next?