Vev Help Center
Search…
Video Carousel
Sliding gallery of tiles, each containing a video and a title.

Configuration Options

Parameter
Type
Description
Poster Image
Image
An image to display in the carousel tile before the video begins playing.
Video
Video
The video to play in the carousel tile.
Title
Text
The title, visible in the bottom left corner of the tile.
Want this link to be clickable?
Toggle
Turns the video title into a clickable link.
URL
Link
The target destination where the user will be directed after clicking on the title. Available only if the "Want this link to be clickable?" option is turned ON.
Number of visible slides per device mode.
Numbers
desktop: the number of tiles visible at a time when viewing on desktop device.
tablet: the number of tiles visible at a time when viewing on tablet mode.
mobile: the number of tiles visible at a time when viewing on mobile mode.
Autoplay Carousel
Toggle
Slides through the carousel automatically.
Autoplay Interval Speed
Milliseconds
The interval for which the carousel pauses before automatically continuing to the next tile. (Only when autoplay is ON)
Previous/next arrow placement
Dropdown
Customization option for tweaking the placement of the carousel navigation arrows.

User Experience

The Video Carousel is designed with a separate desktop and touch-device user experience.

Desktop

Hovering over a particular video tile automatically starts the video. The volume mute/unmute buttons toggle the audio. Video is automatically paused when the cursor leaves the tile.

Touch Devices

Tapping on a video tile brings up the native video controls to play/pause the video, control volume, enter full screen, and seek through the video. A video that is currently playing will automatically be paused when the user taps plays a different video in the carousel or when the user navigates through the carousel.

Adding a Tile

Double click on the Video Carousel element to open its settings modal. Under tiles, click the "+" button to add a new tile. Then, fill your tile with content by filling the fields for each tile.

Device Breakpoints - Responsiveness

Users can uniquely specify the number of tiles to display for each device mode including desktop, tablet, and mobile mode. Double click the Video Carousel to open the element's settings modal. Here, specify the number of tiles you wish to be visible for each of the listed device modes. Once completed, switch the Vev Editor device mode between desktop, tablet, or mobile mode to see the effect.

Styling Options

Tile Overlay

Each tile in the Image Slider contains an overlay, layered above the video and below the title. This overlay improves readability by creating contrast between the text content and the video. The overlay color can be modified using interface found under Editor Styles Panel > Background > Overlay.

Title

Each tile contains title text, for which the following styles can be edited:
  • Font size, family, spacings, and color,
  • Background
  • Border and border radius
  • Padding
  • Margin
  • Shadow

Styling the Title into a button

In the Video Carousal's settings modal, users have the option to turn the Title into a clickable link. In such cases, designers may want to decorate the Title to look like a button. This can be done by tweaking the many style options available for the Title element. Below is just one example.

Volume Button

The volume mute/unmute button is visible only on the desktop experience. The size and color of the button can be styled use Editor Styles Panel > Text > Volume Icon.

Custom Shapes

The left arrow, right arrow,. volume mute, and volume unmute icons used in the Video Carousel element can all be replaced with custom icons. This can be done in Editor Styles Panel > Shapes.
Last modified 6mo ago