Video

Overview

The Avonni Video Component focuses on delivering a robust and seamless video viewing experience. Equipped to handle various video sources, including CMS and YouTube URLs. The component has customizable features such as volume control, playback rate, autoplay, loop, control visibility, and size adjustments.

Properties

Name

Description

Usage

CMS Video OR Video URL

Define the video's source, either by selecting a video from a CMS or providing a direct YouTube URL

Choose the video source that best aligns with your content strategy, ensuring that it is effectively integrated and managed within your pages.

Volume

Set a background image for the container.

Upload or provide a URL for an image that enhances the visual appeal of the container, contributing to the mood or thematic tone you wish to convey.

Playback Rate

Apply a color overlay on top of the background image.

Choose a color that subtly overlays the background image, helping to maintain the visibility and readability of the content within the container.

Autoplay

Decide whether the video should automatically start playing when the page is loaded.

Enable or disable autoplay based on user experience considerations, ensuring that the video playback aligns with user expectations and browsing behavior.

Loop

Determine whether the video should loop continuously once it reaches the end.

Use the loop feature to keep the video playing repetitively, suitable for background visuals or consistent multimedia presence on a page.

Hide Controls

Choose whether to display or hide the video controls, affecting how users interact with the video content.

Customize control visibility based on the desired level of user interaction and the aesthetic considerations of your page layout.

Size

Define the size parameters of the video, including width and height, and control the overflow behavior.

Adjust the video size and overflow settings to ensure the video integrates seamlessly into the page, maintaining a responsive and visually cohesive layout.

Last updated 7 months ago

Overview

Properties

Name

Description

Usage

CMS Video OR Video URL

Define the video's source, either by selecting a video from a CMS or providing a direct YouTube URL

Choose the video source that best aligns with your content strategy, ensuring that it is effectively integrated and managed within your pages.

Volume

Set a background image for the container.

Upload or provide a URL for an image that enhances the visual appeal of the container, contributing to the mood or thematic tone you wish to convey.

Playback Rate

Apply a color overlay on top of the background image.

Choose a color that subtly overlays the background image, helping to maintain the visibility and readability of the content within the container.

Autoplay

Decide whether the video should automatically start playing when the page is loaded.

Enable or disable autoplay based on user experience considerations, ensuring that the video playback aligns with user expectations and browsing behavior.

Loop

Determine whether the video should loop continuously once it reaches the end.

Use the loop feature to keep the video playing repetitively, suitable for background visuals or consistent multimedia presence on a page.

Hide Controls

Choose whether to display or hide the video controls, affecting how users interact with the video content.

Customize control visibility based on the desired level of user interaction and the aesthetic considerations of your page layout.

Size

Define the size parameters of the video, including width and height, and control the overflow behavior.

Adjust the video size and overflow settings to ensure the video integrates seamlessly into the page, maintaining a responsive and visually cohesive layout.