A carousel is a card list. It is an effective way of displaying web content (image, text, video, etc.). Custom Carousel widget is one of the most easiest widget of all of ours. I’ll include section by section instructions to help you get started.
To Insert Widget
Inserting widget, it is just a matter of drag and dropping. As you see in the screenshot above.
Using the content tab, you’ll be able to make a layout of a particular part (custom carousel) of a website. And in this regard, some handy sections in the tab will assist you a lot.
This section will allow you to set skins like custom content with default one. In addition, you’ll be able to determine the Layout of the carousel such as Coverflow and Carousel.
After dragging and dropping the widget in a new section, you will get a list group. The list not limited, you can add a new list in the group just clicking on the ADD ITEM button.
Look at the functionality of both of the screens separately.
Go to the Content tab > Slides > Skin (Default) > Layout (Coverflow)
You can edit every single list item(repeater). Simply, hit on the List Item and edit the field found in the List Item. Then, set Type (Image, Video), Image, and Link to (Media File/ Custom URL).
The important thing is that you can also set Image Size(Thumb, Medium, Full, Custom, etc.) and Image Fit(Cover, Contain, Auto).
Especially, here, you can determine the number of content per slide view from the control Slides Per View.
Go to the Content tab > Slides > Skin (Custom Content) > Layout (Coverflow)
You can edit every single list item(repeater). Simply, hit on the List Item and edit the field found in the List Item. Then, set Source location(Editor or Template).
This time go to the Slides control> hit on the repeater (Item#1) Source (Editor).
Simply, go to the Slides control > hit on the repeater (Item#1) Source (Elementor Template) > Select Template ( like Offcanvas)
Most importantly, here, you also can determine the number of content per slide view from the control Slides Per View.
Note: If you want to work with the Template source location, you have to make a template. And to do that go to the WordPress Dashboard > Templates > Add New > then edit the template with Elementor.
This section will allow you what type of navigation you want to display with the carousel and its position. If you select dots, then you’ll be able to make dots/ bullet points dynamic. Here, I’ve shown arrow and fraction.
Simply, go to the Content tab > Navigation > Arrows Position.
In this section, you can manipulate the carousel animation options like Transition Duration, Autoplay, Autopaly, Autoplay Speed, Pause on Hover, Infinite Loop, Centered Slides, Observer, Width.
Just, go to the Content tab > Additional Options.
Now, let’s work with Style Tab. The tab will easily have you style the web content (text, image, video, etc.) of the page you require to design.
Styling with the Style tab in Elementor will always give you a fantastic experience.
Let’s have a look.
You will be able to add space between every slide item. Moreover, you have a chance to add background and border color, padding and border radius. Most importantly, you can add shadow mode if your design suit.
Simply, go to the Style tab > Slides.
Go to the Style tab > Navigation > and check all the controls. Look at the screenshot.
In Conclusion, though our Custom Carousel contains some tricky parts, hopefully, in the end, you have got the solution. You can stream the video clip above. And to get more ideas about the widget. Visit the demo page.