What's the Best Way to Put a Map in Your Blog

By
Real Estate Agent with United Country Countryside Realty

I needed a map for a blog I'm working on.  I made a google map, used google's little Link to this Page button to get the appropriate HTML code, and copied that HTML code into AR.

I posted it in draft status, checked it...it looked good.

Went back in to add some more text to the blog, and AR has rewritten my HTML code.  Now the map is showing the wrong area.

Any ideas on why this is happening?  I assume something in the code isn't compatible with the AR frame, but have no idea how to fix it.

Any ideas for something that will work as a map in an AR blog?

I'd prefer something active, like google, where they can click for a larger view, etc., rather than just a picture of a map.

Thank you all in advance.

Comments (9)

Matthew Rosov
Amerisave Mortgage Corporation - Laurel, MD
Certified Mortgage Planning Specialist

That is odd.  Have you ever fiddled with the HTML section of posting?

1) copy the code for the map again. 

2) Edit the blog post

3) click on the HTML button (then answer yes to the popup question)

4) paste the link you have copied to the portion of the html code after <a href="  but before the  ">

5) in the space after the "> but before the </a> type in what you would like to appear as the link portion (click here for map)

6) resave the blog

this should do it.

so your html code should look like this

<a href="http://maps.google.com/maps?f=q&hl=en&geocode=&time=&date=&ttype=&q=carthage,+mo&ie=UTF8&z=12&iwloc=addr&om=1">Click for map here"</a>

Nov 27, 2007 05:45 AM
Judith Reppert
United Country Countryside Realty - Mount Vernon, MO

Hi Matthew,

Thanks so much, your instructions definitely helped.  Here's what happened.  The first time I tried, I didn't have any text in the blog at all.  I just went to the html page, plunked in my map code, and posted.   So in following your directions, this time I did go in and edit the blog post by putting in a short test sentence on the WYSIWYG page.

I posted, then went back to edit, went to the html page and copied my google reference in there again.  Now it works, and the map stays the same.  The code for the map is still rewritten by AR, but for some reason, the rewrite now works. 

Here's what the code first looked like from google:

<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?f=s&amp;ie=UTF8&amp;om=1&amp;ll=37.063944,-93.746338&amp;spn=1.520957,3.147583&amp;z=8&amp;output=embed&amp;s=AARTsJqLooHExGkOiZxeQFkPIvFZv4hDAQ"></iframe><br /><small><a href="http://maps.google.com/maps?f=s&amp;ie=UTF8&amp;om=1&amp;ll=37.063944,-93.746338&amp;spn=1.520957,3.147583&amp;z=8&amp;source=embed" style="color:#0000FF;text-align:left">View Larger Map</a></small>

Here it is after AR got hold of it:

<iframe src="http://maps.google.com/maps?f=s&ie=UTF8&om=1&ll=37.063944,-93.746338&spn=1.520957,3.147583&z=8&output=embed&s=AARTsJqLooHExGkOiZxeQFkPIvFZv4hDAQ" marginwidth="0" frameborder="0" height="350" marginheight="0" scrolling="no" width="425"></iframe><br /><small><a href="http://maps.google.com/maps?f=s&ie=UTF8&om=1&ll=37.063944,-93.746338&spn=1.520957,3.147583&z=8&source=embed" style="color:#0000FF;text-align:left">View Larger Map</a></small>

I don't have a clue what happened, but at least it's working and it seems to have to do with having some text in there first.

By the way, is there a "save" buttom that I'm missing on the blog page, or when that question pops up when you try to switch from WYSIWYG to HTML, is it really just telling you to post as draft?

Thanks!  This was my first venture onto the HTML page!

I should have a blog post out in a bit, drop by and see my lovely map!

Nov 27, 2007 06:10 AM
Judi Morgan
RETIRED - San Antonio, TX
San Antonio, TX Real Estate
Judith, looks like Matthew helped you with your problem.  I just checked your blog and I see the map is there.  :)
Nov 27, 2007 11:31 AM
Matthew Rosov
Amerisave Mortgage Corporation - Laurel, MD
Certified Mortgage Planning Specialist

Judith - When you want to save the blog, change the visibility to Draft then "post".  Go back in on edit mode and change to HTML.  Once you have made the changes, change visibility to public and re post. 

Once you get more comfortable with HTML - you can actually write your entire blog from there or in another HTML program then copy/paste to AR.

Nov 28, 2007 01:32 AM
Larry Wright
nwRealty.Com - Tacoma, WA
Judith ... Google, Yahoo & Mapquest all have instructions for embedding their maps within html pages.
Nov 29, 2007 03:25 AM
Judith Reppert
United Country Countryside Realty - Mount Vernon, MO

Hi Larry, yeah, that's what I followed, but as I told Matthew above, AR does "stuff" to the code google provides.  The ways of computers are mysterious, indeed.  I did get it resolved although I have no idea why adding text first made it work.

Thanks for coming by!

Nov 29, 2007 10:56 AM
Find a Notary Public needAnotary
QEC Internet Services - Long Beach, CA
I also found that AR don't like and blocks Google scripts and coding.
Dec 24, 2007 02:55 PM
Gary Woltal
Keller Williams Realty - Flower Mound, TX
Assoc. Broker Realtor SFR Dallas Ft. Worth
Judith I was thinking about saving it as an image but the other ideas seem more practical (and advanced).
Dec 27, 2007 01:23 PM
Todd Clark
eXp Realty LLC - Tigard, OR
Principle Broker Oregon

I've had problems with that even using others instructions, but I've used a .JPG of the map I want to use and put an HTML link to Googlemaps for a large map and moving around.

Feb 04, 2008 05:31 PM