Drupal Lite 8, 9: Embed a Google Doc in a Page

This article applies to Drupal Lite 8 and 9.

A Google Doc can be embedded in a page. The Doc needs to be published to the web so that visitors can view the presentation on the page. Sharing does not need to be enabled.

Embed a Google Doc

Publish the Google Doc

  1. Select File.
  2. Select Publish to the Web.The publish to the web options are displayed.
  3. Select the Embed tab at the top.
  4. Select Publish.
  5. Select Start Publishing.
    1. A confirmation is displayed. Select OK.
  6. Copy the Embed Code.
    • There are additional publishing options in the Published Content and Settings section at the bottom of the window.

Edit the Embed Code

The Drupal custom block will only accept the URL that is in the copied embed code. Remove the extra HTML from the embed code.

  1. Open a text editing application (Google Docs, Word, Text Edit, Notepad, etc.)
  2. Paste in the embed code.
  3. Remove the <iframe src=" from the beginning of the embed code (shown with yellow highlighting in the image below).
  4. Remove the "></iframe> at the end of the embed code (shown with yellow highlighting in the image below).
    • Ensure that the quotation marks are removed. Only the URL should be used.
      the embed code for the published google doc. the html to remove is highlighted.

Embed the Google Doc in a Drupal Lite Page

  1. Log in to the Drupal Lite site.
  2. Locate the page to edit.
  3. Select the Layout button. The Layout Builder is displayed.
  4. Select the Add Block button in the region where the slides will be displayed. The Choose a Block palette is displayed.
  5. Select Create Custom Block button at the top of the palette. The Add a New Custom Block palette is displayed.
  6. Select iFrame. The Configure Block palette is displayed.
    1. Enter the Title for the iFrame
      • Deselect the Display Title if you do not want it displayed.
    2. Paste the copied URL of the published Google Doc in the iFrame URL field.
    3. Enter iFrame Title, iFrame Width, and iFrame Height. These are optional and can be left blank.
    4. Select Add Block. The Configure Block palette is closed and the Layout Builder is displayed.
  7. Select Save Layout near the top of the page.

an example of a google doc embedded in a page. the image shows the page title, and then some body text, and then the google doc below that.

TDX ID
5759