Components | Video
"Video" component allows us to add a local video (which is added to the content and can be played off-line) or an on-line video (which requires an Internet connection, as it is hosted in YouTube, Vimeo or other streaming platforms).
This component is added within the screens by default (see here) and pop-ups (See here), but it can also be added inside other components (for example, inside a Pop-up, a Row, etc.).
You will find this component in the group of "Multimedia" components.
Setup process
1. Access to the "Properties" tab. Go to "View" property and select if you want to add a local video (saved in the unit Resources folder) or an on-line video.
2. If you choose "Local video", you will be required to configure at least the following properties:
-
Resource: mp4 video file.
-
Cover: This property allows adding a cover image that will be shown while the video is not being played.
Additionally, you can configure other properties (see the list at the bottom of this page).
3. If you choose an "On-line video", you will have to configure at least a "URL address" from YouTube, Vimeo or other streaming platforms like Brightcove. Additionally, you can configure other properties (see the list at the bottom of this page).
4. Additionally, you can go to the "Add" tab to include a "Caption" for the video.
Video properties
PROPERTY
DESCRIPTION
Title
Video title.
View
This property allows adding the type of video: a local video (included in the unit Resources folder) or an on-line video (hosted by YouTube, Vimeo or other streaming platforms like Brightcove).
Resource (.mp4)
This property is only enabled when we select "Local video" inside "View". It is the video file that will be displayed. We will click on "Examine" to access the unit Resources folder (check here), and select the video we want to show. Only mp4 files are supported.
Cover
This property allows adding a cover image that will be shown while the video is not being played. It is used for local videos and on-line videos.
Lock fast forward
It allows to decide if the user can advance or rewind freely through the video or if the reproduction will be automatic and will not be able to interact with it.
Subtitles
This property is only enabled when we select "Local video" inside "View".This property allows associating video subtitles to each available language. Click on the "+" button to add a subtitle file.
Then select the language and associate it with the subtitle file. File must have vtt format.
URLaddress
This property is only enabled when "On-line video" is the option selected inside "View". It allows adding the URL address of the video.
Completion mode
This property DOES NOT WORK at this moment. We do not recommend using this property.
Width
This property allows changing the space occupied by a component inside a central column of contents. The component occupies 100% of the space by default, but size can be reduced to other preset percentages or can be displayed in "full-size". Some quote styles may overlap the central column if "Full" width is chosen.
Align
This property allows placing the component on the right, on the left or on the centre of the central column where contents are shown. It can only be used when applied "Width" is less than 100%.
Float
It allows inserting a component and "wrap" it with a text.
- First, we should select a size percentage under 100% in "Width" property (25%, for instance).
-
"Float" property allows us to decide where we would like to put the floating component (on the right or on the left of the text).
- We use arrows to move the component and put it on the text.
