Quick tricks with Google maps and iframes

Many of you will be familiar with the Google maps iframe insert that you can put into web pages and Facebook pages

Here are a couple of tricks to change the way it looks.

This  is what the iframe insert looks like

Remove the Google maps infobox

Add “&iwloc=near”  to the end of the iframe src url

Get a satellite image of  Google maps iframe

change  “&t=m” to “&t=k” and you will get the satellite image

Change it to “&t=h” to get a hybrid map (map and satellite).

Change the zoom level of  Google maps iframe

The zoom level is controlled by the z parameter. The lower the number the more zoomed out you will be, so in this example I have changed it to “&z=3″

The highest it will go is “&z=18″

There seems to be no way of changing the zoom control on the map which is a shame

About these ads

29 comments on “Quick tricks with Google maps and iframes

  1. I’d echo that. The info box, satellite view and zoom level are nice tips. However I found this because, having located the iframe, either to the left or right of the column in my wordpress.com blog, I was hoping to put text alongside, as I might when I embed an image. Any suggestions?

  2. Duhhh…:-) Thanks very much. Works a treat. If I remember I’ll post the URI here so others can see it. once I’ve published the post. In your example above, I’m just seeing the URL for the map, and not the map itself. I just took a quick look at the source, and the map is looking for a box of 425px width, but your source only gives it 100px. I’m guessing you were in a hurry, so the solution is especially appreciated. Thanks again.
    D

  3. That’s really useful info, thanks. Since you’re an expert in this, I wonder if I could ask you a tech question about it? Someone asked me to fix their google maps popup. I have two jpg maps on a page. When you click on each one, you get an iframe google maps popup. They both look fine. The iframe says Image 1/2 at the bottom and has a next image button – which I suspect may be related to the problem. On the second image, when you click any nav button (zoom in/out) it zooms to the map on the first image. If I swap the order of the maps around – same thing happens – second image button zooms to map of the first. Any ideas what I can try? Unfortunately it’s not on the web yet so I can’t show you.

    • Hi Dave

      Not too sure I understand the problem but why have two map images you can have two iframes on the same page so why not go straight to the map.
      Difficult to see without the site in front of me

  4. Do you mind if I quote a couple of your posts as long
    as I provide credit and sources back to your website? My website is in the very same niche as yours and my visitors would truly benefit from some
    of the information you present here. Please let
    me know if this alright with you. Thanks a lot!

  5. Thanks for the tips….. really helped me customizing it.
    Do you know how to remove the buttons at the top of the map i.e. Map, Sat, Ter, Earth.
    I also wanna put this post in my blog too, and put you a pingback … Can i ?

  6. Great Stuff, thanx.
    Is there a way to hide the google logo and footer? I thought that there was a code in the API who fix that problem. But i cant find the parameter code for that.

    • Not with this embedded method no – as it uses an iframe. If you implemented a full google api then there may well be underhanded ways, using css, to hiding the branding. This is not something I recommend.

  7. I’m wondering if there’s a way to change what appears in the info box. Currently it shows the wrong town and postal code for my address, but shows the right marker location. I’m embedding it on my website.

  8. Hi
    Great tips, I am using the iframe method (maptype=roadmap) on one of my clients websites (estate agents – on the property details page) and I have used your tip for hiding the info box – and he has now asked if we can add an option to allow visitors to call up a street view. Is this possible in the iframe method?

  9. There used to be an option to review and edit embedded map, like changing the center point. Now that option is gone. Is there any way to move the pin lower in the frame so that the info window doesn’t look too close to the pin?

    • @Rick
      Not that I am aware of. There are two options remove the infobox altogether or make the map large enough so that the box does not go off screen.

      As a note to others you used to be able to use a parameter “&ll=[lat],[long]” to offset the centre

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s