The Video Element will allow you to add a video to your page and display it within a user-controlled video player.
Note that this is not the only way to display video on your site -- you can also add a background video to another element (such as a container, grid, or text box.) If you aren't sure which method to use, refer to this article that can help you decide.
Adding a Video Element to the Page
Click and drag the video element icon from the left toolbar, and drag it onto the page:
The video element may be placed as a root element on the page or placed within another element (container and grid elements only). It will automatically take up 100% of the width of its parent element.
When the video element is first placed on the page, it will be empty: the next step will be to add a video to it.
Adding a Video into a Video Element
To add a video to a Video Element, click the play button icon inside the video element. This will open the video uploader panel:
You can add video from YouTube or Vimeo by pasting an external URL, or you may upload your own video.
Adding a Video Thumbnail
By default, when you add a video the thumbnail image will be provided by the third party provider (Vimeo or YouTube), or as a freeze frame 3 frames into the clip.
If you want to change the thumbnail, the 'Add Image' button will prompt you to open your local drive to add a thumbnail image to your video.
If you want to use an image that you've already uploaded, the 'Open Media Library' button allows you to add a thumbnail image from the media library.
The Video Control Panel, accessible from your right toolbar, will allow you to specify some settings for the video element:
- Edit Video: Re-opens the video uploader to select a different video.
- Loop Video: Sets the video to loop.
- Live Preview: Turns the video playback on and off while you are working in the Brandcast design studio.
- Auto Play: Sets a video to automatically play. Available for YouTube and Vimeo videos only, not for uploaded videos.
- Mute audio: Mutes the sound of the video.
- Play Scroll: not yet available.
- Audio Scroll: not yet available.
Resizing Videos in a Video Element
The video will proportionally scale the size of the Video Element, and maintain its aspect ratio. If you want to crop the video, or display it at full browser-width, you may want to consider using a background video instead.
Deleting an Video Element
To delete an Video Element, select any video element that has been placed on the page by clicking on it (or accessing the video element from the breadcrumbs bar or page structure panel) and select delete on your keyboard.