Skip to content

Background Type ​

You can choose the display type of the slide background: background image, color, transparent, or video (YouTube, Vimeo, HTML5).

Background type selection

Background Image ​

Background Image URL ​

Set the image URL. You can enter a URL directly or pick an uploaded image from the Media Library.

Alt Text ​

Set an SEO title for the image.

Title ​

Set the image title.

Background Fit ​

  • Cover: The most common option. Your image will always fill the entire size of the slider (cropping may occur).
  • Contain: The entire image always fits inside the slider's boundaries. Image cropping will never occur, but you may end up with blank space on the sides of the image.

Background Position ​

Sets the alignment of the image inside the slider area (center, left, right, top, bottom, etc.). See W3Schools: background-position.

Background Repeat ​

Sets whether the image tiles and repeats — useful for texture backgrounds. See W3Schools: background-repeat.

Filters ​

Add Instagram-type filters to your slide's background image.

Parallax / 3D ​

To use this option, first make sure Enable Parallax is set to ON in the slider's main parallax settings.

Adding a parallax level here will apply movement to the main background based on mouse-move, scrolling, or both.

Ken Burns Effect ​

An elegant pan/zoom that will move and scale the main background image slowly after the slide comes into view.

Transparent ​

Set to not display any background; the slider's own background will show through. Useful for stacking with other slides or minimal designs.

Color ​

Use a solid color as the slide's main background.

Color background

YouTube Video ​

YouTube video background

YouTube ID ​

Visit the video on YouTube.com and view the URL in the browser's address bar. The ID is the part after "v=". In the following example, the ID is AkcUoA2f-jU:

https://www.youtube.com/watch?v=AkcUoA2f-jU

Set Cover Image ​

The video's "cover" is what will animate when the slide first appears.

Force Cover ​

  • ON: The video covers the entire size of the slider (usually the best option for video backgrounds). Cropping may occur depending on the video's aspect ratio in relation to the slider's size.
  • OFF: The video always respects its aspect ratio and is never cropped. Blank space may occur on the sides depending on the aspect ratio.

Dotted Overlay ​

Choose to display a "mesh-like" transparent graphic on top of the video, adding some extra style.

Aspect Ratio ​

YouTube offers two versions of the video: 16×9 or 4×3. For video backgrounds, 16×9 is usually best.

Start At ​

Start the video at a specific time, in minutes:seconds format.

Loop Video ​

  • Disable: The video plays only once each time the slide is shown.
  • Loop – Slide is paused: The video loops endlessly.
  • Loop – Slide does not stop: The video loops endlessly until the slide's delay is reached.

Next Slide On End ​

  • ON: The slide changes immediately as soon as the video ends.
  • OFF: If the video's length is less than the slide's delay, the slide will not change until the delay time has been reached.

Rewind at Slide Start ​

  • ON: The video always starts from the beginning each time the slide is shown.
  • OFF: Once the video plays, if the slide is changed before the video ends, the video resumes from the same point when returning to the slide.

Mute Video ​

Choose to mute the video's volume if it normally has sound.

Video Speed ​

A special option to play the video at a "fast forward" speed.

Arguments ​

Additional parameters that can be passed to the video — see the YouTube player parameters list.

Vimeo Video ​

Vimeo video background

Vimeo ID ​

Visit the video on vimeo.com and view the URL in the browser's address bar. The ID is the part after "vimeo.com/". In the following example, the ID is 106249100:

https://vimeo.com/106249100

Cover Image / Force Cover / Dotted Overlay / Aspect Ratio ​

Same as the identically named options for YouTube video backgrounds.

Start At / End At ​

Start and/or end the video at a specific time, in minutes:seconds format.

  • Example "Start At" value: 00:17 (start the video 17 seconds in)
  • Example "End At" value: 02:17 (end the video at 2 minutes, 17 seconds)

Loop / Next Slide On End / Rewind at Slide Start / Mute / Video Speed / Arguments ​

Same as the identically named options for YouTube video backgrounds. For "Arguments", see the Vimeo embedding parameters list.

HTML5 Video ​

Set Video URLs ​

Upload a video to your site via FTP, and enter the full URL of the video in the fields.

An "MPEG" version of your video (a file ending with ".mp4") is mandatory. MPEG works almost everywhere except Firefox on Macs. Because of this, it's also important to include an alternative version of the video, which can be either "WEBM" or "OGV" — Firefox on Mac supports both, so you only need one or the other. You can use a free tool such as Miro Video Converter to create "ogv" and "webm" versions of your video.

Cover Image / Force Cover / Dotted Overlay / Aspect Ratio ​

Same as the identically named options for YouTube video backgrounds.

Start At / End At / Loop / Next Slide On End / Rewind at Slide Start / Mute ​

Same as the identically named options for YouTube video backgrounds.

Mobile autoplay

Some mobile devices block video autoplay by default. Enable HTML5 Autoplay on Mobiles in Problem Handlings to autoplay HTML5 background videos or video layers on mobile devices.

Next Steps ​

Built with VitePress