How do I embed a dynamic Google document into the Rich Content Editor?

You can create a document, slide presentation, or spreadsheet using Google Drive and then embed that document anywhere you can use the Rich Content Editor in Canvas. Any time you edit the Google document, it will be automatically updated in Canvas. For more information on how you can use this feature, visit this topic in the Community Forums.

Note: You might notice that some formatting, such as margins or line spacing, is lost when you embed a Google document into your course.

Create Google Document

Create any type of common file using Google Drive to embed it in your course content.

Publish to the Web

Publish to the Web

Open the File menu and select Publish to the web....

If the File menu is minimized, expand the menu by clicking the down arrows next to the edit icon.

Start Publishing

Start Publishing

Make sure that the Automatically republish when changes are made checkbox [1] is selected. Click the Start publishing button [2].

Click the OK button.

Copy Embed Code

Copy Embed Code

Copy the text that appears in the Embed Code box. You can easily copy this text by highlighting it and typing Ctrl+C on your Windows keyboard or Command+C on your Mac keyboard.

Log In to Canvas

Log in to Canvas and access your course.

Open HTML Editor in Rich Content Editor

You can make your Google document appear anywhere that uses the Rich Content Editor. Access the Rich Content Editor where you want to show your Google document and click the HTML Editor link.

Paste Embed Code

Paste Embed Code

In the HTML view [1], paste the embed code you copied earlier by clicking in the text box where you want the Google document to appear and typing Ctrl+V (Command+V on a Mac).

To make sure the content appears correctly, switch back to the Visual View by clicking the Rich Content Editor link [2].

Adjust Height and Width

You may want to change the width of the embedded document. Using the Rich Content Editor, click and drag the embedded document box to the desired width. The height will automatically adjust to the new width of the box.

You can also adjust the height and width of the frame in the HTML Editor. Adjust the numbers that appear in quotation marks after the words "width" and "height" in your embedded code, as highlighted in the above image. You can also use percentages to change the width and height.

Save Changes

Save Changes

Click the Save Changes button.

View Embedded Google File

View your newly embedded Google document.

(Optional) Lesson Feedback (0)

Please let us know if any information in this lesson appears to be incorrect in terms of Canvas functionality only (please do not submit feature requests here). This is not a help site, and submitted comments cannot be answered. If your Canvas course/account is having trouble completing any of the tasks outlined in this lesson, please contact Canvas Support by submitting a HELP TICKET via the Help Link within Canvas or emailing support@instructure.com. Thank you.

E-Mail me if a reply is posted