Contact Us

First & Last Name (required)

Email (required)

Comments

healthcarewell pharmacy

How to Embed a Google Doc into Moodle

Embedding a Google document requires an extra step when compared to embedding a Google Form or presentation. It’s a little “quirky.” You need to not only copy the embed code from Google, you also need to add a little “extra” code for the document to display as a full page.

Shown immediately below is the iframe code copied from Google for embedding a document.

iframe src=”https://docs.google.com/document/pub?id=1L9VAvG5Y1YK86QoPM-R5yZ7hU7i-TdUQADLB1ygz0Io&amp;embedded=true”></iframe></p><p>

With the above code the Google Document displays in the exact size shown below:

google doc

The following needs to be added to make the document display in a larger size:

frameborder=”0” height=”800” width=100%

If the above do not work, manually type them in rather than copying and pasting from this document.

The embed code would now appear as

iframe src=”https://docs.google.com/document/pub?id=1L9VAvG5Y1YK86QoPM-R5yZ7hU7i-TdUQADLB1ygz0Io&amp;embedded=true” frameborder=”0″ height=”800″ width=100%></iframe></p><p>

frame border =”0″ removes black border that appears around embedded Google Doc and its own iframe horizontal scroll bar.

width = 100% means to use whatever given width the display device has available for the page.

If you want to see how the document looks with the black border: don’t add the frameborder command or set it to 1. You can also experiment with including frameborders with different colors.

Directions for embedding a Google Doc

  1. File…Publish to the Web
  2. The following window appears:

google doc

  1. When you click on Start Publishing, the following window appears:

google doc

  1. When you click OK, the following window with embed code appears:

google doc

  1. In Moodle, edit the page you will use to embed the Google doc.
  2. Click on the HTML Source Editor icon on the bottom row of the editor.
  3. Paste in the embed code in the HTML Source Editor icon. Then add the frameborder=”0″ height=”800″ width=”100%” in the correct spot in the embed code.
  4. Click on update and then click on Save and Display in your “normal” page edit view.

eClass4learning offers the Moodle Reference Desk, our end user support system for online instructors as they create and teach online courses. It contains numerous easy to follow tutorials created by our instructors. It is a lifeline for course creators and teachers new to Moodle.

Sandra Orwig

sorwig@eclass4learning.com

2 Comments

Post a Comment

Comment
Name
Email
Website

 

Learn More. Subscribe.

 

Email (required)

Interest (required)

Hold the ctrl key to select multiple interests.