How to work with image carousel with Elementor

Do you want to work with image carousel with Elementor?

People love carousels and sliders and the website owners want to have it on their website. With a beautiful image carousel you can easily make your website look gorgeous. Elementor offers you the features to add image carousels on your website. As an Elementor user you won’t miss this feature. 

You can use the image carousel with Elementor free so there is no need to upgrade for the pro version. Without investing money you can make a beautiful image carousel section in your website using Elementor. Here in this article we are going to show you how easily you can work with an image carousel with Elementor.

Work with image carousel with Elementor

In Elementor free image carousel widget are available and using the widget you can easily create your image sliders. It will allow you to add basic image galleries with some extra features and options. The free image carousel widget is fully mobile responsive and makes your website look better.

Using this widget you can import the image directly from your media files. You can also add image title, caption and description to describe the images. There is an option to select the image sizes, numbers and set the scroll effects. So, let’s see how to implement the image carousel widget in your website.

Adding image carousel widget

At first create a new page or open an existing page where you want to add the image carousel. Select the section and click on the “+” icon of Elementor. After that choose the column and then from the left dashboard search for the image carousel widget. Drag the widget and drop it into your selected section.

Your image carousel section is added in your section now you need to add an image and set some features. From the content tab you can find the image carousel option from where you need to add your images. Just click on the plus icon and then add images from your media file or upload images from your computer.

After uploading the image you can set the image size. There are a few sizes available, you can also set the custom size of your own.

Now from the slide to show option you can set how many images to display in one slide. From the slide to scroll option set the number of images to scroll when you click on the navigation arrow.

You can enable or disable the image stretch option. If you set it yes there will be no gap between the images. We enable the image stretch option, no you can see the difference.

From the navigation menu option you can set the navigation as –

• None
• Arrow
• Dots
• Both arrow and dots

From the link option you can add a custom url and from the caption option you can easily add image title and description.

Additional info

Now come to the additional info option from where you can enable or disable the auto play, pause on hover and pause on interaction option. You can set the auto play speed, animation speed and slide direction too.

Style

Now move on to the style tab to style the section. From the navigation option under the style tab you can style navigation arrows and dots. From the arrow option you can set the arrow position as inside or outside, set the arrow size and color.

The dot option enable you to set the dot position, size and color.

From the image option you can set the image vertical align as start, center and end. You can also set the space between the images using the spacing option.

You can add border type, border width, radius,color from the border option.

Following this way you  can easily style the element of your image carousel. From the advanced tab you can also set some advanced settings of the carousel section. You can see our article to learn how to work with the Advance option of Elementor.