Norway Timelapse
PlayPlay
Budapest Timelapse
PlayPlay
Iceland Timelapse
PlayPlay
Berlin Timelapse
PlayPlay
London Timelapse
PlayPlay
previous arrow
next arrow
Norway Timelapse
Budapest Timelapse
Iceland Timelapse
Berlin Timelapse
London Timelapse
previous arrow
next arrow

Free Video Slider

💻 Settings | 🎓 Layers | 🎉 Animations | 🏗️ Layout | 📱 Responsive | Speed

Description: Do you want to create a YouTube slider to your website? Check this example, and import it free from the Smart Slider 3 template library.

Free: Give Smart Slider 3 a try for free. Download now!

Minimum version: 3.5.0.0

Tags:

Settings

Many people use YouTube videos on their WordPress site, because they load fast and watchable on any device. Thanks to Smart Slider 3 you can create a nice looking, responsive YouTube slider for free. There are many options to configure the videos to behave the way you want them to. For instance, you can make the videos play automatically, or to loop in your free video slider.

At each YouTube layer you have other useful settings. For instance you can adjust the video quality. Or you can make the video start again after the visitor has changed the slide and has come back to the video. Additionally, this free YouTube slider has another interesting feature: the thumbnail navigation.

Slide settings
Slide settings

A thumbnail navigation like this is easy to create. You can enable the Thumbnail control at the Controls tab of the slider settings. You can quickly add a YouTube video on your slide with the YouTube layer. Then you can set a thumbnail image for your slide, and set the type to video. This puts a play icon on the thumbnail image.

Layers

Each slide has one layer: a YouTube layer. The aspect ratio is 16:9 at all of the videos, and the Autoplay is disabled at the first, but enabled at the other slides. The paddings of the Slide and Content layer are reduced to 0px, so the video will take up the width and height of the slide.

Settings of the YouTube layer
Settings of the YouTube layer

Animations

When you switch a slide, the next slide will come in with a horizontal animation. This animation is the main animation of the slider. You can change it or remove it if you don’t want this kind of animation on your slider at the Animations tab of the Slider settings.

Layout

The main content of each slide is the YouTube video. Under the videos there are the Thumbnails of the slides which you can switch the slides.

Responsive

By default the thumbnails are hidden on mobile in Smart Slider. At that YouTube slider we enabled the thumbnails, so you can switch slides with them.

Core Web Vitals

PageSpeed Insights with Lighthouse analyzed this page on April 12, 2021. For the latest result analyze now!

100

Desktop

First Contentful Paint
0.3 s
Speed Index
0.5 s
Largest Contentful Paint
0.5 s
Time to Interactive
0.3 s
Total Blocking Time
0 ms
Cumulative Layout Shift
0
100

Mobile

First Contentful Paint
1.1 s
Speed Index
1.3 s
Largest Contentful Paint
1.8 s
Time to Interactive
1.1 s
Total Blocking Time
0 ms
Cumulative Layout Shift
0

Related Post: Everything You Need To Know About YouTube Slider

Related Post: Why do You Need a Video Slider on Your Website?


Similar Sliders -

Video BlockYouTube slider with ThumbnailsLawyer SliderYoga Hero Block