in Google |

Hide / Remove Info Window / Bubble for Embedded Google Maps

A quick note added in February 2011. Google has now removed the iwloc part of the url in most cases. To remove the pin, you can now add &iwloc=near to the end of the iframe src attribute. So….

<iframe width=”300″ height=”300″ frameborder=”0″ scrolling=”no” marginheight=”0″ marginwidth=”0″ src=”http://maps.google.co.uk/maps?f=q&source=s_q&hl=en&geocode=&q=manchester&aq=&sll=53.41654,-2.236788&sspn=0.033864,0.090294&ie=UTF8&hq=&hnear=Manchester&t=h&z=12&ll=53.480712,-2.234376&output=embed“></iframe>

…would become…

<iframe width=”300″ height=”300″ frameborder=”0″ scrolling=”no” marginheight=”0″ marginwidth=”0″ src=”http://maps.google.co.uk/maps?f=q&source=s_q&hl=en&geocode=&q=manchester&aq=&sll=53.41654,-2.236788&sspn=0.033864,0.090294&ie=UTF8&hq=&hnear=Manchester&t=h&z=12&ll=53.480712,-2.234376&output=embed&iwloc=near“></iframe>

Thanks to John below for pointing this out

Old information:

Google have tweaked things again. Here is the latest way (March 2009) to embed a map including a location pin without the annoying info window or info bubble showing above it and ruining the maps centre location.

This is particularly important if you are using a small sized map less than around 400px square.

1. Go to google maps or google maps uk
2. Do a search to find (and pin) the location you want to embed a map of.
3. Click the text link, which you will find top right of the main map.
4. Click Customise and preview embedded map
5. Change the dimensions of the map as required and drag the pin to the centre of the map using your mouse.
6. Copy the embed code.
5. In your embed code find the src of the iframe tag ( <iframe src=”http ) and replace

iwloc=addr

or

iwloc=A

with

iwloc=near

6. Stick the embed code into your website and marvel at seeing a pin but no info window.

Before view:

Before iframe code:

<iframe width=”300″ height=”300″ frameborder=”0″ scrolling=”no” marginheight=”0″ marginwidth=”0″ src=”http://maps.google.co.uk/maps?f=q&source=s_q&hl=en&geocode=&q=manchester&sll=53.800651,-4.064941&sspn=21.613333,29.619141&ie=UTF8&t=h&ll=53.492131,-2.228851&spn=0.122552,0.205994&z=11&iwloc=A&output=embed”></iframe>

After view:

After iframe code:

<iframe width=”300″ height=”300″ frameborder=”0″ scrolling=”no” marginheight=”0″ marginwidth=”0″ src=”http://maps.google.co.uk/maps?f=q&source=s_q&hl=en&geocode=&q=manchester&sll=53.800651,-4.064941&sspn=21.613333,29.619141&ie=UTF8&t=h&ll=53.492131,-2.228851&spn=0.122552,0.205994&z=11&iwloc=near&output=embed”></iframe>

Agency focused strategist, Agile coach and champion of humans

Published

102 Comments

  1. I noticed, after much toiling, that DW CS4 displays the map with the bubble. But after I uploaded it, it displayed fine. Thought that might help some of you. Dw show the bubble when it is not “live”.

    -nice tips

  2. Hi Harry,
    Thanks for you tips here. I’m hoping you can help.

    I’m using PrettyPhoto [iframe] to load a Google map and came upon your site when searching on how to remove the address on a google map.

    Basically, my window opens, Google map shows up, but the info (address etc) shows in the left pane. The user can click an arrow to slide the content closed, which brings the map into full view, which is okay, but not ideal.

    Is there a way to set the code so that the info doesn’t show up on the left – just the map? Basically, the default is to show the info of the business on the left. Is there a toggle or way to change this default so the user would have to ‘click to expand’ vs the opposite?

    I hope this is clear.

    Thank you in advance!

  3. I’m afraid it doesn’t look like that’s possible mike.

    The address bar isn’t altered when you click / expand / close the left column, so I don’t think even a clever url would allow it.

  5. Great tip, thanks.

    I had the same problem as Greyholme, so I thought I’d try rather than replace anything with the code just add “&iwloc=near” to the string, and it worked like a charm! Hope this helps someone!

    Cheers,
    John

  6. Hi John,

    I believe that only works because of the way Google parses the url of the map. The later value wins if there are two iwloc values.

    Harry

  8. Google no longer includes iwloc in the embed code, at least not in the US version of maps. However, John is correct when saying appending &iwloc=near to the end of the embed code will in fact kill the bubble. Thanks to him for the help on that one.

  11. Hi there Harry,

    Excuse the daft query, but has something changed again? I’ve been hunting around for a solution to this and this seems to be the most recent. I’ve created my own map, followed the instructions and can’t seem to get rid of the bubble, in fact the link you have provided to the fixed code (map of manchester) it still shows a bubble.

    I am wondering if I am being a completed loon? or missing something?

    my map http://cargocollective.com/studioeleven#1323647/Contact-us

  14. Hi Harry,

    Wanted to thank you for the code you offered above to add iwloc=near to get rid of that nasty Google map bubble! THANKS! 🙂

    Question for you… do you know how to remove the business labels that appear when you grab that iframe code?

    I want to embed maps on customers sites, but don’t want my customers competitors showing! That would be “bad” 🙂

    Thanks!

    – Cynthia

  19. Hai Harry,
    please help me, i have a wordpress site. in my contact section i am displying Google map with my address. everthing works fine. but i need to show Directions in new window from address bubble. is there any possible to do that.

    Thanks in advance.

  20. Hello Harry

    Great tutorial, I removed the bubble no problem but can’t get the pin text that shows up when you hover over the marker to dissapear, heres my code

    [Code Missing!]

  26. Thanks, it works just fine to add the &iwloc=near on the end. Especially useful for some business where Google displays aggregated information that a business might not want to appear there. It also moves the center of the map as you mentioned (also annoying). Thanks again..

  33. One year later and I was still able to tack this code on! For the record, our code was so outdated that I had to tack on all of “&output=embed&iwloc=near” for anyone wondering.

  35. Thank you so much for that. I’m working on a Google Site and thought I was just stuck with that bubble – dropping that piece of code into the html works a treat! Many many thanks!

Comments are closed.

Webmentions

  • links for 2009-09-01 | pollas.dk [permanent meta] » Blog Archive Saturday, March 9, 2013

    […] Hide / Remove Info Window / Bubble for Embedded Google Maps | Harry Bailey (tags: google maps embed trick) […]