Question about Dynamic Sizing of Embedded Content and Canvas LMS

Hello!

Our institution is moving to the Canvas LMS, and we were wondering how to use the dynamic sizing script for embedded content.  Does anyone know how we can use this feature with Canvas?

BV52's picture

Hi sfielder,

Afaik the embed code is designed to be dynamic in a sense that it should adjust to any size screen.

-BV52

Hi!  There is an embed code option, which I used to add the H5P item to a Canvas Page.  It doesn't seem to allow dynamic sizing.  When I size the browser window to a smaller size, the content gets cut off rather than adjusting to the size of the browser window.  Perhaps I'm not understanding dynamic sizing?

What I'm actually asking about is the option in the advanced portion of the box that pops up when clicking "Embed" in a project.  Toggling open the Show Advanced says, "Include this script on your website if you want dynamic sizing of the embedded content" and includes a script to copy:

<script src="https://h5p.org/sites/all/modules/h5p/library/js/h5p-resizer.js" charset="UTF-8"></script>

My question is:  Where should this script be placed to allow the dynamic sizing of H5P content placed in a Canvas LMS page?

 

icc's picture

This is more of a question for you Canvas admin/contact, however, I believe there is an option in the theme editor to automatically include custom .js files on all pages.

SparTacuS's picture

Hi sfielder,

As a Canvas/H5P user I can tell you that this script will definately NOT work in Canvas.

Canvas will strip any "active" HTML code from your page for security reasons. So it will let you enter this code to your page using the HTML editor. You then save/publish and when you check back it will have been stripped out.

On a more possitive note. Canvas and H5P work together pretty well anyway and will have a pretty good try at resizing your content anyway. I try to keep most of my stuff as H5P "Column" content (1 or 2 per page) and it stands up to resized windows/different platforms quite well.

 

SparTacuS