How to Embed Content into Canvas

Community Advocate
Community Advocate
11 16 13.1K

Abstract: 
In this webinar we will explore various ed tech platforms and we will walk through the process of making our Canvas content awesome. Learn how to dress up your courses and add flair and meaningful interactivity and multimedia. 

This session will target beginner and intermediate Canvas users.

Description: 
Let's begin with a Canvas basic. Canvas uses the same Rich Text Editor everywhere: announcement pages, discussions, assignments, content pages, quizzes, etc. This Rich Content Editor allows you to format text by changing the size, color, indentation, create bulleted lists, insert hyperlinks or images, and so on. When you edit using the Rich Content Editor, you see exactly how it will turn out when you publish it. (for more info, see: http://bit.ly/2ycdvmp). 

However, when you switch to HTML view in Canvas, you are able to embed content. Embedding is using HTML code to allow you to place an online element right onto your Canvas page. If you have embed code from VoiceThread, ThingLink, Padlet, Pinterest, or any number of other online resources, then you can place those right in Canvas. Below are some examples of embedded content in Canvas: 

http://bit.ly/2x5AdfQ  
http://bit.ly/2x8Fqp3  
http://bit.ly/2ycmlAF  
http://bit.ly/2ydrSHk  
http://bit.ly/2x2GgUU  
http://bit.ly/2h7gJA0  

You do not need to know how to code and you do not need to be a programmer to be proficient at embedding content. Embedding content does involve working with HTML code, but all you need to know is what to copy and how to paste it. And then you're set up and you'll find that it is easier than you could have imagined to add interactivity to your courses! Once you learn the basics you'll find that it's very simple. 

Learning Objectives: 
1. Familiarize yourself with the basics of HTML embed code 
2. Discover ed tech resources that can be embedded into Canvas 
3. Explore a whole new world of multimedia and Interactivity 

Tags (3)
16 Comments
Community Member

Thanks for the reminder, stefaniesanders‌! Monday will be kind of hectic, but I will be listening in if I can. And I need to go back and watch Sean's video from InstCon. In fact, that is one where I should work on the captions. I watched via Twitter during the actual conference, and lots of people were tweeting, but that's not the same as getting the whole thing. 🙂

Community Team
Community Team

I'll be looking for you, laurakgibbs‌! And for anyone who wants to watch the InstructureCon video to which Laura referred, it's  

Community Team
Community Team

Reminder: https://community.canvaslms.com/events/2281-how-to-embed-content-into-canvas will start approximately one hour from now (at 1:00 PM EDT).

Community Team
Community Team

Here's a link to a Canvas course Sean has created that you can use in conjunction with the presentation: Embedding Content in Canvas  This course contains links to all of the tools Sean demonstrates.

Adventurer III

To answer the question about the Sway icon (and provide a link to the Google results), the share icon for Sway is generally used as a collaboration icon: Google 

Community Advocate
Community Advocate

snufer Nice Work on this presentation. The best part to me is seeing the live demonstration of how to embed content from those various sources as well as your comments on the benefits of sharing with students. I will share this with the faculty at my college.

Community Advocate
Community Advocate

Thanks professorbeyrer@gmail.com!  Learning to embed opens up a whole world of possibilities.  

Community Team
Community Team

Special recognition goes out to snufer Thank You for leading this event. Sean has received 50 points for setting up and facilitating this great session!

For more on how YOU can host a CanvasLIVE event, check out How do I set up a CanvasLIVE event? or join the Community User Group: CanvasLIVE‌!

Community Advocate
Community Advocate

Thanks cesbrandt.  That makes lots of sense.  Sway is a very collaborative platform.  

Community Team
Community Team

The video of this session is available at  

Community Advocate
Community Advocate

Many thanks.  This was a fun session to do.  

Community Coach
Community Coach

snufer

my time zones got confused and I missed the session. BUT I'm watching it now. Already seeing some gems. The AAAAA idea when using HTML - brilliant. Thank you! And thanks stefaniesandersfor sharing it.

Surveyor

Just wanted to say thanks to snufer for this session.

I’ve been using the placement AAAAA trick for a while and found it really useful for embedding content.

We’ve just about to launch a mini online resource for staff on using media in Canvas and this session was great as it covers  much of what I have used. Great minds think alike I guess.

Thanks for sharing

Community Member

I just want to know the HTML for embedding -- not watch a whole video. This is frustrating.

)c:

Community Coach
Community Coach

Hi Marie:

I think I might be able to make your day. A few years back, with Instructure's help, we created a CanvasHacks Demo course where HTML (plus more) coding tips are providing with a large selection of code snippets that can be used in your courses. This includes an entire module on embedding content.

If you want to enroll yourself as a student, please follow this link.

If you would like to be enrolled as a teacher, please send me your email via DM.

Kelley

Community Advocate
Community Advocate

The html code might look different depending on the platform that the embed code is coming from, but generally you will look for some sort of SHARE option, and then search for an embed link and copy the code.  If it's javascript <script> then it won't work in Canvas, but if you see <iframe> or <div> then you'll likely have success.  Sometimes if I'm lazy then I'll just grab the embed code from a YouTube video and replace the video URL with the URL to whatever page I'm wanting to embed.  

About the Author
Sean Nufer works collaboratively with the Instructional Design team and faculty to ensure utilization of state-of-the-art resources in the classroom. He knows how to make gifs, but they're not very good.