Video element

Misty Flowers

January 02, 2018 19:41

The Video element displays a single video from Resources and auto-fills the width of its container, including options for resolution, autoplay, captions, and mute behavior. Add it from the Standard tab of the Element Library.

💡Quick answers

Selecting a video to display? Click Browse in Video element settings and pick the video from Resources.
Can a video autoplay? Yes. Enable Autoplay. iOS playback also requires Muted and Plays inline on mobile (iOS) to be enabled.
Showing or hiding play/pause and volume controls? Choose Show Controls (lets users pause, mute, scrub) or Hide Controls. If Hide Controls is selected, Autoplay is required.
Where do closed captions come from? From the closed caption file attached to the video in Resources. Enable Closed Captions in the Video tab of element settings to display them.
Preventing videos from opening fullscreen on iPhones? Enable Plays inline on mobile (iOS) so the video plays as part of the page rather than in a lightbox.
Is it possible to display multiple videos in one element? Yes. Switch to List, Grid, or Slideshow format. Controls work the same as the Resource element.

What are Elements?

Elements are the fundamental building blocks of your Composer pages. Learn more about how elements work in the article, "Understanding elements" and read about each of the 5 tabs in the element library: Standard, Module, Layout, Social, and Shared.

The Video element displays a single video from Resources. It will automatically fill the width of the container the element is displayed in. Navigate to the Standard tab in the Element library to insert a Video element onto your Composer page.

video element.png

Element Settings

In addition to the common element settings, the Video element includes the following configuration options.

Browse: Use this button to search for the specific video within Resources and select it to display in the element.

All

Display Resource: Choose to display the filename or the title of the video, or none.

Video

Resolution up to: The choices are 4K Ultra HD (2160px), Full HD (1080px), HD (720px), SD (480px), but by default the element will display the video at the optimal resolution for the video and the screen size. Making a selection among the choices provided will override the automatic default, and force the video to display at the selected resolution.
Show Controls/Hide Controls: Enable “Show Controls” to allow users to pause and play the video, mute and control volume, and skip to a specific point in the video. “Hide Controls” will not allow any of this functionality, so “Autoplay” is required.
Autoplay: Enable this option to make the video play automatically, rather than waiting for the user to press play. If Autoplay is selected, the "Muted" and "Plays inline on mobile (iOS)" options are required.
Closed Captions: If a closed caption file is included for the video in Resources, enable this option to display it.
Loop: With this option enabled, the video will return and play from the beginning after it reaches the end.
Muted: This option automatically mutes the video. If the “Show Controls” option is also enabled, users can choose to unmute it.
Plays inline on mobile (iOS): By default, a video viewed on an iOS (Apple) device will open in a lightbox and block out the rest of the page when played. With this option selected, the video will instead play as part of the page.

Advanced

Ignore URL Parameters: If this option is selected, the resource displayed in the element by default will remain even if user-selected criteria would normally override it.

List, Grid, and Slideshow formats

Note that the Video element can also be converted to a List, Grid, or Slideshow format, which functions the same way as the Resource element. Refer to the Resource element article for more information about these settings.