How do I embed a Google map?

The Google map embed code that is provided in the Link feature of Google maps contains iframe tags.  The iframe tag creates an inline frame that contains another document.

In terms of standards compliance, use of iframes is actually a rather hotly contested topic.  Some bad things can happen with iframes including the illicit injection of code into a webpage.  Additionally the iframe tag is invalid in both Strict Document Type Definitions (DTDs) and XHTML version 1.1.

The Tiny MCE text editor used in our OSU Drupal installation does not work with iframes.

There is a workable solution for embedding Google maps in OSU Drupal 6.  It is not the most desirable solution, but it is available.  To be able to follow this process, the content contributor must have permission to use the PHP code input format.  Under default circumstances, this would be an administrator or advanced author role.

To embed a Google map, do the following:

  1. Create your content as you would normally.
  2. In the Input format fieldset, select PHP code.  This will eliminate the rich text editor.  For this to work, the input format must remain at PHP code.
  3. Paste the following code into your Drupal site's text editor:
    <object id="map" type="text/html" data="insert your map source URL here&output=embed" style="width:450px;height:300px;">
  4. Get your Google map source URL - do not use the code in the Paste HTML to embed into website field.  Instead, copy the URL in the Paste link in e-mail or IM field.
  5. Paste the source URL exactly as shown below:
    <object id="map" type="text/html" data="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Oregon+State+University&sll=37.822802,-115.532227&sspn=25.118232,39.506836&ie=UTF8&hq=Oregon+State+University&hnear=&ll=44.660839,-123.277588&spn=5.477444,9.876709&z=7&output=embed" style="width:450px;height:300px;">
  6. Add anything else desired and then click the Save button.

A sample of an embedded map is provided below: