Embed videos and other external media

Embed videos and other external media


Intended Audience:  Administrators, Instructors

Summary

Add content published on cloud applications by embedding it in your text & image modules.

Embedded content appears as part of the module, but without uploading a copy to Safety Made Simple.

Your external content must be published and shareable, subject to the access permissions set by your system administrator.

External content includes:

  • documents and presentations hosted on cloud applications like Google Drive, SharePoint and Office365
  • videos from sources like YouTube, Vimeo, or Wistia

Where to find embeddable media URLs

Safety Made Simple supports iFrame based media embedding but does not support JavaScript based embedded videos. The embed code for your content must rely on an iFrame, and not 3rd party JavaScript. Generally:

  • if you see <iframe>tags in the embed code your video will work
  • if you see <script>tags, the embedded video will not work

Some providers, such as YouTube, offer iFrame by default. Navigate to the content you want to share and click Share > Embed underneath the item. This step generates the iFrame based code you can embed in Text & Image modules.

Some providers like Wistia offer both standard and fallback embed codes. In this case, you want to choose the fallback option, which is iFrame-based.

The following screenshot shows Google Drive's Publish to the web > Embed dialog for a link to a presentation.

Make media responsive to resize for different screens

By default, most embed codes generated for you are not responsive: they are set to a fixed height or width, and do not adjust to different screen sizes or mobile devices.

To ensure your content fits across all screen sizes, Safety Made Simple recommends a wrapper class to work with the embed code:

<div class="video-responsive">
    <iframe src="embed_url_for_video" width="100%" />
</div>


In this example, the embed_url_for_video comes from the video provider. The embed code for this video is:

<iframe width="560" height="315"
        src="https://www.youtube.com/embed/2wuN7IRLMxU"
        frameborder="0" allow="accelerometer; autoplay;
        encrypted-media; gyroscope; picture-in-picture" allowfullscreen>
</iframe>


 Take the URL found in the src above and put it into the wrapper class. The finished responsive embed code is:

<div class="video-responsive">
    <iframe src="https://www.youtube.com/embed/2wuN7IRLMxU" width="100%" />
</div>

 


    • Related Articles

    • Create a text and image module

      Intended Audience: Administrators, Instructors Summary Text and image modules let you write text, embed images and videos, paste directly from Word, or build custom tables. Create a text and images module From primary navigation select Courses > your ...

    • Creating and managing content in Safety Made Simple

      Intended Audience: Administrators, Instructors Create courses from "chunks" of content, made up of modules and segments. Courses and modules are reusable, so you can build courses from existing content and resources. Modular structure The following ...

    • Course content types

      Intended Audience: Administrators, Instructors Summary Anyone can build courses in Safety Made Simple. Upload and arrange your existing content, then drag and drop it straight into the course. Overview Mix, match, and structure your courses by ...

    • Assignments: record a video for an assignment

      Intended Audience: Admins, Managers, and Learners Summary Learners can record a video for immediate upload as part of their assignment, while on a course. Video assignments for learners: overview Safety Made Simple lets learners record a video for an ...

    • Image sizes overview: logos, course images and certificates

      Intended Audience:  Administrators Use your own logo and brand in the Safety Made Simple portal. Each image has a recommended size and aspect ratio. This is for single portals only, not shared portals. If you aren’t sure which plan you’re on, or ...