Adding a video hover element

Uploading a video to Vev

Styling a video hover element

Configuration options

Video Hover element in Vev

👍🏽 Adding a video hover element

  • From the top menu bar, click on the Add Menu (Shortcut: M)

  • Search for and select 'Video Hover'

  • Click and drag the element onto your canvas

Uploading a video to Vev

From a URL

  • Double-click the Video Hover element

  • Click the pen icon under Video background

  • Select From URL

  • Give your video a name

  • Under Video Source select + Add Item

    • Enter your video URL

    • Select the video type

  • Hit save

  • Once the video has been uploaded, hover over the video then select

From Your PC

  • Double-click the Video Hover element

  • Click the pen icon under Video background

  • Select Upload Video

  • Choose the file from your PC

Uploading a Video to Vev

🎨 Styling a video hover element

  • Background:

    • Default Overlay: Set an overlay for the default video

    • Hovered Overlay: Set an overlay for the video appearing on hover

  • Text:

    • Default Overlay: Style the text appearing on the default video

    • Hovered Overlay: Style the text for the video appearing on hover

  • Padding: Add padding to the Text, Hovered Text, and Text Body evenly on all sides, or mix them

  • Border: Set a border color, opacity, and line weight

  • Border Radius: Curve the radius of the border

  • Effects: Add different types of shadows or blur effects. Learn more about effects

Styling a Video Hover element

⚙️Configuration options

Double-clicking on the Video Hover element on your canvas opens the configuration options.

Video Hover configuration options

Parameter

Options

Default Text

This text body is visible in the component's default state - when the component is not hovered.

Hover text

This text body is visible when hovering over the component.

Video background

This video plays in the background in the component's default state - when the component is not hovered.

Hover video background

This video plays in the background when hovering over the component.

Did this answer your question?