A basic element for showing videos using VideoJS. Supports YouTube only at the moment.


Uses IntersectionObserver to lazy load the YouTube player when user has scrolled the video into view.


Property Attribute Description Type Default
autoplay autoplay If you're using this inside a content-overlay for example, you may want the video to play immediately on launch. boolean false
class class string ''
controls controls boolean true
fitContainer fit-container Fit the container this video is placed in. When the video is used in an overlay or another place where the video will takeover the existing height, it is recommended to enable this option. string 'false'
height height number 9
method method "html5" | "youtube" 'youtube'
playButtonAriaLabel play-button-aria-label string 'Play'
preload preload string 'metadata'
src src Supports YouTube and self hosted URLs. string ''
type type string 'video/mp4'
width width number 16


Slot Description
Default slot, same as content slot.
"content" Adjacent to no-js message for video. Usually not needed.
"no-js-message" Contents of no JS message.
"playButton" Play button contents.
"poster" Poster shown before video is played.


View Example in New Window
Content Blocks free of warranty. All rights reserved.
Structural Preview

content-video (alpha)

  • Description
  • Benefits
  • Properties
  • Slots
  • Examples