How to Add Google Maps in a WordPress Site?

Fri, May 8, 2009

Featured, WordPress

My wife was helping a friend with a website for their pediatric dentistry in Okemos. She wanted to insert a Google Maps location in their Contact page so anyone looking up their website can easily find directions to the office.

Their website is running on WordPress and here’s how we added Google Maps to their website.  Just note that these instructions are for self-hosted WordPress blogs only.

  1. Get a Google Maps API Key from here. It’s as easy as logging in with your Google account.
  2. Install Inline Google Maps WordPress plugin
  3. Go to Plugin configuration page and enter the Google Maps API Key from step 1 and save it.

    google-maps-wordpress-plugin

  4. You can adjust your Maps dimensions for your site here:  it defaults to 500px by 300px.
  5. Go to Google Maps, find the place you want in the map, adjust the zoom and double click on the place you want to be in the center of the map. (or right click on the pin and choose to center map here)
  6. On the top-right corner, find the ‘Link’ button and copy the link there. You may have to play with this a little bit to get it right. Try generating links at various zoom level and check how it shows up in your website.

    google-maps-link

  7. Now go to the page you want to insert the Google Maps
  8. Type in a text you want to appear in the marker in the map like ‘Discover Smiles’ and add the link you copied in step 6

    google-maps-wp-link

  9. Make sure you give the link a title of ‘googlemap’ (you can enter a title of ‘googlemap;nocontrol’ if you don’t want an interactive map)
  10. Publish your page and you are done!

google-maps-in-wordpress

Hope the above steps weren”t too hard to follow. Let me know in the comments if you have any questions.

You can also add various options to the map via plugin parameters. Also check out Avi’s post linked at the bottom if you are looking to add more bubbles, features to the map.

[via Avi Alkalay

Popularity: 8% [?]



Related posts

Relevant Tags: Google, google maps, how to, tips n tricks, web-design, WordPress

6 Responses to “How to Add Google Maps in a WordPress Site?”

  1. Chris Says:

    Top stuff, I shall put this to use shortly…

    Chriss last blog post..Return To Clachan An Diridh

  2. K Says:

    Chris, great to see you again man! I almost didn’t recognize you but your email clued me in. :-) Hope you are keeping well.

  3. Emma Says:

    Thank you so much for this post, after working my way through 3 other plugins I was getting very frustrated with not being able to get the googlemaps working, but now I feel much better!
    Thanks for the great post x

  4. K Says:

    Emma, I am so glad to hear that this post helped you out. Thanks for taking the time to letting me know. Much appreciated and good luck! :-)


Trackbacks/Pingbacks

  1. [...] How to Add Google Maps in a WordPress Site? (shankrila.com) [...]

  2. [...] How to Add Google Maps in a WordPress Site? (shankrila.com) No TweetBacks yet. (Be the first to Tweet this post)SHARETHIS.addEntry({ title: “Local Online Marketing – at least have an entry on Google Maps”, url: “http://www.counterpointmatters.com/localseo/local-online-marketing-entry-google-maps/” }); [...]

Leave a Reply