Skip to content

Video

Description and Purpose

Learning Environment (LE) layout components are interactive modules that typically replicate a real-world tool and allow learners to take specific actions in the exercise. Depending on which components are used in an exercise, different tests and checkpoint functionality may be available.

The Video component in the LE provides space for a video in the form of a Youtube embed URL or a URL that’s stored in Codecademy’s Amazon S3 bucket.

This is the only layout that supports video content.

Content Location

This is a Layout Component that can be added to an exercise in a lesson or a project.

An exercise, represented as a rectangle, contains three other rectangles labeled narrative, and Video Component.

Fields in Author

URL

URL of the video you want to display.

  • If it’s a YouTube video, you must use the embed url which likely has the format:
<iframe width="560" height="315" src="https://www.youtube.com/embed/[VIDEOID]?controls=0" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  • YouTube URLs in the embedded iframe must be in the format youtu.be/[video id], not youtube.com/watch?v=[video id.].

  • You may wish to remove some of the arguments in the allow parameter as they may override selected settings.

  • Ensure users are able to enable or see captions on your video. This aligns with Codecademy’s accessibility standards

Settings

In Author, there are several optional checkboxes that can change how the video will play for learners.

Autoplay Video

This causes the video to play as soon as the learner enters the exercise.

Loop Video

This setting causes the video to replay the video after it ends.

Mute Video

This setting causes the video to play without sound.

Show Video Controls

This setting causes the video to show video controls, like pause and play, in the exercise along with the video.

Examples