pen paper writing icon WordPress icon png newspaper icon

How To Create Slider Images In Elementor

Create Slider Images In Elementor

When you visit just about any website one of the first things you will notice is a slider either on the top or in the middle of the page. The main reason that they are so common is that site visitors love them, and website owners find them extremely useful. Slides are a great way to display a variety of information in a way that keeps your site visitors engaged.

Elementor is a helpful tool that will allow you to create attractive sliders and image carousels with only a few steps. Our guide will walk you through creating modern Elementor sliders and carousels for your website.

Image carousels design 1

Popular Elementor Sliders

Elementor has a few different sliders to choose from, some of the most popular are; the Elementor Slider widget, the Smart Slider, the Layer Slider, and the Revolution Slider. There is one carousel widget available for basic users and several available for pro users. All of the widgets regardless of account class are fully integrated which makes them easy to set up while creating a seamless user experience.

The easiest to use is the Elementor Slider widget which we will cover in this article. Although some users may find developing their website to be easy, other people may find it more difficult. In any case, we would recommend consulting with a dedicated website design company in Manchester, like Blue Whale Media, to help you with your web design and development.

Creating Sliders in Elementor

Making slides in Elementor is not as complicated as you may think. From your account panel if you are using the basic version of Elementor, select the Carousel widget. This widget will allow you to create image galleries full of basic images that look attractive on your website and on the mobile version of your website. You can upload new images from your laptop, or can select existing images from the media library.

You can access the Elementor console by clicking on your image gallery and then from the drop-down menu on the left side, click create a gallery. Select all the images you want to display click on the picture. A checkmark will appear in the upper right hand of the picture, and a copy will also be displayed at the bottom of the screen. Once you have selected the images for your slider, you can make additional customizations to the images and slider itself.

In the widget panel, choose what size of images you want to display and how many pictures you want to appear in the panel next to each other. You can also choose the scrolling speed from the drop-down menu in the widget panel. Select the number of images you want to scroll at once.

For example, you can set the scroll for one picture at a time, or can have a set of pictures scroll to the next panel at the same time. For sliders that have a large number of images, 2-3 per scroll is ideal.

Image carousels design 2

Elementor Pro Slider

From your account panel, if you are using the pro version of Elementor, you will be able to choose from several slider widgets. This allows you to do all of the same things as the basic slider, but with an expanded set of options. The option to add a title and description for each image are available, and you can also write a caption that will display along the bottom of each image in the slide. This is a great way to incorporate keywords or put a call to action on your slides.

Access the Elementor settings panel, and then open your gallery. Add images by clicking on them. There will be an expanded set of options on the left-hand side of your screen. You can select colors or images to have in the background of each slide, or you can apply a colored overlay. If you are feeling very creative you can adjust the background blend mode as well.

Customizing Your Image Sliders

A wide assortment of customization options is available for your Elementor image sliders. To access these features simply click on the style tab on the upper left-hand side of the screen. From here you can adjust the border size and settings, the image spacing, even the filter and shadows on each image. Embellish your slider by adding dots or arrows along the bottom. You can change the color, size, and shape of these in the style tab as well. This will give site visitors a visual clue as to how many images are in the slide in addition to providing a way for them to manually scroll through the images on your slider.

A Short Cut For Elementor Image Slide Creation

If you are just looking for a quick way to add an image slider to your site or WordPress with Elementor, this shortcut can help. Click the edit page or add a new page on the left-hand side of your screen. Then, with the Elementor button click edit. A dashboard will open up on your left, from the dashboard search for and select the slider widget option. Drag the widget from the dashboard and drop the element onto your page. This will place the slider and trigger a new dashboard for the slider’s settings to open. Select your desired settings after uploading the images you want from your computer or media gallery. Once your selections of final, click update. Your new Elementor image slide is ready to go!

Image carousels design 3

Creating Alternative Image Carousels in Elementor Pro

Creating a Media Carousel in Elementor is easy. The widget will allow you to generate a thumbnail slider with optional larger images in a lightbox. Similar to a regular slider, the media slider allows you to select and display content directly from your gallery and set it to scroll. The difference with this widget is that you can use videos from your media gallery or make use of video URLs from Vimeo and YouTube in the lightbox area. The instructions to set up this slider are the same as the basic and pro image slider instructions, but using videos instead of still images.

You can also use the Reviews Widget to create a slider that features images and text. This is a great way to showcase your customer feedback with their actual words and a picture they have provided of your product or service. This slider can be set at the top or bottom of your webpage and set to scroll just like regular sliders. With so many slider options available, creating a responsive and aesthetically pleasing website is no more than a few clicks away.