The Offer Expires in:

Days
Hours
Minutes
Seconds

Slider Layout – Elementor

To showcase multiple videos in a slider, we can use the Elementor’s Loop Carousel Widget, which we also used to showcase the videos on our homepage yt2posts.com.

Note: Using the Loop Carousel Widget as described here does not create connections to YouTube, meaning that this approach is GDPR-compliant

In summary, we will go over the following sections:

The Final Result

Here is the slider (i.e. carousel) that we are going to make in this tutorial:

carousel final result
The slider made using the Elementor’s Loop Carousel Widget.

The Steps

1. Creating the Loop Template

The first step is to create a Loop Template. The loop template describes how a single video within the slider will be displayed. The slider then applies this Loop Template to each video within the slider. In our example, the Loop Template looks as follows:

loop final preview
A Loop Template describes how a single video is displayed within the slider.

We have described how to create such templates in our previous tutorial: Loop Templates – Elementor, so you can check it out for a step-by-step tutorial.

Once the Loop Template is created, it’s quite easy to create the slider. Simply open the page where you want to insert the slider and drag and drop the Loop Carousel Widget, as shown in the image below.

loop carousel widget
Adding the Loop Carousel Widget.

Now we need to specify that we want the slider to use our Loop Template that we have previously created. In the Layout Field, start typing the name of your Loop Template. After typing the first few letters, your template appear in the dropdown list. Our Loop Template was named “Tutorial – Loop Template”, so we selected it, as shown below.

adding loop template
Specify the Loop Template you want to be used within the slider (i.e. carousel).

Finally, click on the Query on the left and set the source to Youtube, as shown below. Optionally, you can click on the Style tab to additionally style the slider, e.g. add some padding or change the fonts.

carousel settings source
Specifying the Query source to Youtube.

That’s it, you can now click on Publish or Update in the lower left corner to publish (or update) your slider!

Conclusion

We have shown how a beautiful slider can be created using the Elementor’s Loop Carousel Widget. The advantages of this approach are:

  • Performance: the page speed is going to be fast, since iframes are not used this way and no connection to YouTube is made.
  • GDPR-compliance: since no connection to YouTube is made, this approach is GDPR-compliant.
Updated on July 16, 2023

Have a question for us?

Write to us and we will respond in no time!

This website uses cookies to ensure you get the best experience on our website. By clicking Accept & Close, you agree to our Cookie Policy.