The Image and Video Slider widget for Elementor enables you to create dynamic sliders that showcase both images and videos on your website. With features like smooth transitions, autoplay options, and customizable navigation controls, this widget is perfect for enhancing portfolios, galleries, and promotional content. Its versatility allows for a seamless integration of photos and video elements, providing an engaging experience for your visitors.
Let’s look at each of the options in the Image and Video Slider widget for Elementor below.
Add a Image and Video Slider Widget to Elementor
This widget requires Unlimited Elements Pro version installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “Image and Video Slider”
- Hover over the widget in the search results and click install
- Add the “Image and Video Slider” widget to any Elementor Page
General Settings
Slider Width
Adjust the width of the slider in pixels.
Slider Height
Adjust the height of the slider in pixels.
Autoplay
Enable or disable automatic sliding.
Loop
Enable or disable continuous looping of slides.
Autoplay Hover Pause
It will pause autoplay when the user hovers over the slider.
Autoplay Timeout
Set the time (in milliseconds) between slide transitions when autoplay is enabled.
Transition Speed
Define the speed in milliseconds for slide transitions.
Responsive Breakpoint
Set the screen width in pixels, at which the slider adapts to a responsive layout.
Display
Choose the display mode.
Row – Displays the slider items in a horizontal row.
Row Reverse – Displays the slider items in a horizontal row but in reverse order.
Column – Displays the slider items in a vertical column.
Column Reverse – Displays the slider items in a vertical column but in reverse order.
RTL
The RTL setting enables right-to-left text direction for languages like Arabic and Hebrew.
Layout Settings
Arrows Settings
Items Setting
Manage the items of the image and video slider using the repeater field.
- Add new items
- Duplicate items
- Delete items
- Reorder Items
- Edit Items
Image and Video Slider Widget Styling
There are a number of styling options that allow you to control every aspect of the widget’s design. Choose colors that complement the style of your website. You can modify the text, icons, fonts, and layout to make the widget look and work the way you want.
Content Styling
Set the content background, padding, margin, radius, and width.
Inner Content Styling
You can set the inner content background, padding, margin, radius, and border.
Title Styling
Set the title color and typography.
Text Styling
Here, you can set the color, typography, and spacing of text element.
Button Styling
You can set the button typography, padding, radius, background, text color, spacing and border.
Arrows Styling
Set the nav arrows spacing, positioning, radius, background, icon color, and icon size.
Dots Styling
You can set the nav dots size, color, spacing, and alignment.
Items Title Styling
Set the typography, color and custom style for items title.
Items Button Text Styling
You can set the items button text typography, color, and custom styling.
Image and Video Slider Design Examples For Elementor
Here are some live use cases for the Image and Video Slider Widget.
Image and Video Slider with navigation dots.
Image and Video Slider with navigation arrows.
We hope this overview has illuminated the capabilities of the Image and Video Slider widget. By leveraging its customizable features, you can craft compelling slider that captivate your audience. If you have any questions or require further assistance, please don’t hesitate to reach out. Happy designing!
