Embedding Google Maps on Your Blog or Website

This is a pretty straight forward process, but it also can have a variety of different outcomes depending on which map you want to display. It is useful to know these options to offer a richer visual experience on your blog or website.

Here is the basic run through:

  1. Navigate to the location on Google Maps that you want to embed elsewhere.
  2. Click on the LINK button above the map.
  3. You can take the second link of HTML to embed in your blog – this is the default size 450 by 350.
  4. Useful to note here that this is iframe code which doesn’t work well in WordPress (or Edublogs for that matter) – so if you have a WordPress blog write your blog post in the Visual editor and when you are ready switch to HTML editor, paste your code and then publish straight away. If you switch back to the Visual editor the code will get stripped out and your map will vanish.

Customise your map for embedding:

  1. Hitting the Customise and preview embedded map link will give you a bunch of options and allows you to refine exactly what you want embedded.
  2. The map sizes you can choose from are Small, Medium, Large and a Custom option for you to define the exact size.

You in fact have four different choices for the style of map you can use at this point.

Earth = Google Earth (plugin needed)
Ter = Terrain style
Sat = Satellite imagery
Map = Map

For a fifth and sixth option you can combine the Satellite or Earth imagery with the Maps labels, a little rollover on each button.

Here are the examples of the different maps that you can display embedded below, plus an extra bonus. I particularly like the Google Earth choice that provides that functionality to any user, they of course need the GE browser plugin which is available on Flock, IE, Firefox and Chrome.

GOOGLE EARTH


View Larger Map

GOOGLE EARTH and MAP


View Larger Map

TERRAIN


View Larger Map

SATELLITE


View Larger Map

MAP


View Larger Map

SATELLITE and MAP


View Larger Map

STREETVIEW


View Larger Map

To embed Streetview just drag the little Orange pegman to the map and find your preferred Streetview, then just follow the process explained above, easy. You can always alter the view on the Customise page if you need to.

The location of these maps is the Angel of the North. It is worth looking out for these special locations where Streetview goes offroad and follows footpaths to get up close to various monuments or unique locations.

There you go, seven different types of maps to embed in your blog or website – I hope you found this little guide useful.

8 Comments

  1. Google never stops creating an application that is very helpful not only to them, to individual but to everybody. I just embedded google map in my sites and it looks great.. Your article is worth reading

  2. Here are the examples of the different maps that you can display embedded below, plus an extra bonus. I particularly like the Google Earth choice that provides. It is useful to know these options to offer a richer visual experience on your blog or website.

  3. This is a great way to show students where things are and with the images on Maps they can see the landscape and buildings that are in the area. I will be using this feature this year on my class website. Thanks!

3 Trackbacks / Pingbacks

  1. Where in the World have I worked? « MarkjOwen's Blog
  2. Hur man lägger in karta på sin webbsida | Fredrikhimlen.se
  3. This week’s wins #3 | High Dive Teaching

Comments are closed.