Let’s Raise Our Google Sites Game – Part 2: Embeds

Published by

on

Part 1 of this blog post was a deep dive into raising our Google Sites game with design. Just as important is site content. Part of the allure of Google Sites for digital portfolios in education is how seamlessly the tool integrates with Google Drive. This is very useful but it can lead students and teachers to load up digital portfolios with Google Docs and Google Slides. There is nothing wrong with these tools but it is no longer 1998. We can and should incorporate more innovative tools into the mix. In this second of two parts, we will explore ways to use innovative embeds to raise our Google Sites game.

Before we dive in, a quick word about embedding Google Docs: When using text on a Google Site, consider putting it directly on the site instead of using an embedded Google Doc. I documented that text in embedded Google Docs is not searchable with the Google Sites search function in my Google Sites Layouts Vastly Improved My Digital Breakouts Site blog post.

With that out of the way, let’s raise our Google Sites game by embedding these creativity tools in our Google Sites!

Google Tour Creator

Google Tour Creator is Google’s tool for creating Google Expeditions. Tour Creator tours can be viewed as Google Expeditions or embedded in Google Sites. Use images, sound, and text in points of interest to tell stories. Have a look at this page of a Frederick Douglass digital breakout to see an example of a Tour Creator tour embedded on a Google Site. For more information about Google Tour Creator, please read my blog post, Google Tour Creator Is Great. Gatsby That Is. Here is a video tutorial about embedding Tour Creator tours into Google Sites:

Google My Maps

Google My Maps is Google’s tool for making interactive maps. The ability to add text, images, and videos to map entries make My Maps a great tool for blended learning and student creativity. My Maps save to Google Drive. There’s even a button for it in the Google Sites editor Insert menu:

The Google Sites editor Insert menu with an arrow pointing to "Map."
Inserting a Google My Map into a Google Site could not be easier.

Pro tip: only add landscape oriented images to My Maps entries. Portrait oriented images will appear cut off. For more information on Google My Maps, please read my blog post, Google My Maps Tips and Tricks.

Before we consider some non-Google tool embeds here is a note of caution. The Grammarly Google Chrome extension is wonderful. Unfortunately, it can cause some embeds to malfunction in the Google Sites editor. I have no idea why this is so. If you encounter any difficulty with embedding in Google Sites, try disabling Grammarly to see if that resolves the issue as it did for me.

ThingLink

Animated GIF of ThingLink on a Google Site.
ThingLink on the Escape to Summer Vacation digital breakout website.

One of the very best things to embed in Google Sites is ThingLink. This tool allows users to put interactive links on top of images. It is a great way to showcase Google Slides, YouTube videos, Google Forms, and more without opening new browser tabs. See ThingLink in action in the Sell World War I To The American Public and Escape To Summer Vacation digital breakouts. Here is a video tutorial about embedding ThingLinks into Google Sites:

Quizlet

Quizlet decks are a great way for teachers to help students review content. Better yet, they are a great way for students to take ownership of their learning. Quizlet decks look very professional and impressive when embedded in Google Sites.

Animated GIF showing a Quizlet deck embedded in a Google Site.
A Quizlet deck embedded on a Google Site. This deck was made with Quizlet diagrams.

There are five unique ways to embed a Quizlet deck in a Google Site. To learn more, please watch this video:

Google Jamboard

At present, there is no native way to embed Google Jamboard jams into Google Sites. Unlike other Google Drive files, jams do not embed in Google Sites. There are two possible workarounds:

To learn more about embedding Google Jamboard jams in Google Sites, please watch this video:

PiktoChart

Animated GIF showing a Piktochart inforgraphic embedded in a Google Site.
Piktochart info-graphics are interactive when embedded in Google Sites.

Piktochart is a web-based info-graphics maker. Its info-graphics option includes mouse hovering interactivity. Anyone looking to share data on a Google Site should consider Picktochart because of this interactivity. Have a look at this example to see a Piktochart info-graphic embed in a Google Site.

Video – EdPuzzle and Google Slides

YouTube videos embed in Google Sites just like Google My Maps do with their own button in the Insert menu. Additionally, video from Google Drive embeds into Google Sites. However, neither option allows for cropping video. One great way for teachers to crop videos on Google Sites is EdPuzzle which also allows for adding questions to videos. Additionally, Google Slides can be used to embed cropped YouTube video in Google Sites. For an example of what this looks like on a Google Site, please have a look at this page of the Cuban Missile Crisis digital breakout which had an EdPuzzle and a Google Slides cropped video side-by-side.

Screen capture of a Google Site with a side-by-side embedded EdPuzzle and Google Slides cropped video.
An EdPuzzle and a Google Slides cropped video side-by-side on a Google Site.

Sound – Google Slides and ThingLink

Sound, even in the form of audio files saved in Google Drive, does not embed into Google Sites. Technically it can by accomplished by setting a sound file to public and embedding its Google Drive sharing URL. I do not suggest doing that. Two much nicer workarounds for embedding sound into Google Sites are the aforementioned ThingLink and Google Slides.

Timelines – Timeline JS

Animated GIF of a Richard Nixon timeline created with Timeline JS and embedded on a Google Site.
A Timeline JS timeline embedded on a Google Site

Timeline JS is a timeline generator that embeds beautifully in Google Sites. For an example of a Timeline JS generated timeline on a Google Site, please have a look at the Richard KNICKSon digital breakout. This tool appears daunting but is actually easy to use with simple clicking, copying, and pasting. Thank you, Jeffrey Bradbury, for sharing Timeline JS with me. Watch as I demonstrate how to use this tool and embed timelines in Google Sites:

Music (and Math) – Groove Pizza

An animated GIF depicting how Groove Pizza embeds in Google Sites.
Groove Pizza embeds nicely in Google SItes.

Groove Pizza is a web-based app students can use to make musical beats. Better yet, the app generates “pizzas” topped with polygons and angles – perfect for math.

To learn more about embedding Groove Pizza in Google Sites, please watch this video:

Bonus – Embed WordPress!

Google Sites is great for designing beautiful websites but it is not a blogging tool. If teachers want secondary students both blogging and maintaining digital portfolios, WordPress blogs can be simply embedded into Google Sites digital portfolios. Please watch this video to see how easy this is!

What do you think? What are you embedding in your Google Sites? Let me know or share your questions in the comments below or tweet me, @TomEMullaney.

Does your school, organization, or conference need professional development to help teachers make the most of Google Sites? Have a look at some of my offerings and connect with me on Twitter.

Photo by Ihor Dvoretskyi on Unsplash.

4 responses to “Let’s Raise Our Google Sites Game – Part 2: Embeds”

  1. Lee Hurst Avatar

    What about data studio? It embeds really well, maintains its interactivity, and is now available directly on Google drive!

    Like

    1. Tom Mullaney Avatar

      Sure! I really like Piktochart for that purpose but Data Studio works too. I wrote about Data Studio in my post, Digital Storytelling Without Word Processing Part 1: Google Apps https://tommullaney.com/2019/03/05/digital-storytelling-google-apps/

      Like

  2. Digital Breakouts on EDU in 90 – Sustainable Teaching Avatar

    […] The video references how I use Google Tour Creator in my digital breakouts. I blogged about how I like embedding Tour Creator tours in my post, Let’s Raise Our Google Sites Game – Part 2: Embeds. […]

    Like

Leave a comment

Create a website or blog at WordPress.com