“Mega Slider Widget” helps you to easily turn any Elementor sections into slider slides. Now you can amaze your website visitors with jaw-dropping slider designs that look amazing on any device. You can use sections as slider items and design with no limits. You can use also use the built-in Entrance Animations provided in Elementor to animate the layers when each slide loads to the page. It also supports the advanced options like Remote Control and Sync with other widgets.
Let’s look at each of the options in the “Mega Slider Widget” below.
Install Mega Slider Widget for 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 “Mega Slider“
- Hover over the widget in the search results and click install
- Add your “Mega Slider” widget to any Elementor Page
How it works?
To set up the Mega Slider is very simple- each item in the Mega Slider can be connected to Elementor section by ID. The sections can come from the current page or from an external Elementor template. Step-by-step tutorial is as below.
Option 1: Add sections to the Mega Slider
Design two or more Elementor sections using the page builder. After this you need to go to the advanced settings of a section that you created >> give the section a CSS ID. You can create as many sections as you need for you Mega Slider.
Add items to your Mega Slider. Each item should have a corresponding section ID.
Go to Mega Slider Settings>>>Go to slider items settings>>>In Section ID option, add name for section.
Option 2: Use Template in Mega Slider Sections
Go to Templates in the WordPress side menu >> Add new >> Select the template type as page and give your Template a name. Add all the sections to your template and give each section an ID.
Go to >> Template in “Mega Slider” Settings :
Choose any template for slider sections
Carousel Settings
Set the autoplay option on or off.
Set the slide duration in milliseconds.
Turn on or off the loop option.
Autoplay will pause on mouse hover.
Carousel can be dragged with mouse.
Slider can be dragged with touch swipe.
Show/Hide the arrows.
Choose an icon for left arrow.
Choose an icon for right arrow.
Show/Hide the navigation bullets.
Select the animation from the given options.
- None
- Fade In Out
- Fade In Left Out Right
- Fade In Left Out Right Big
- Fade In Right Out Left
- Fade In Right Out Left Big
- Fade In Out Up
- Fade In Out Up Big
- Fade In Out Down
- Fade In Out Down Big
- Slide In Left Out Right
- Slide In Right Out Left
- Slide In Out Up
- Slide In Out Down
- Zoom In Out
- Zoom In Out Down
- Zoom In Out Left
- Zoom In Out Right
- Zoom In Out Up
Testing and Tools
Show if have any errors
Show debug in items
Show debag in elements
Don't Hide
Hide
Hide with message
Connected Widgets Settings
Use remote control widgets to create advanced creative layouts.
This name will be used to connect and controls this widget by other widgets.
You can connect two item-based widgets and sync them.
Choose the same group for two or more item-based widgets so they can sync together.
Items Settings
Type a title for slider item.
Type the section id of the section to display as slider item.
Nav Arrows Styling
Set the nav arrow spacing, position, arrow radius, icon size, nav arrow background, icon color, icon color hover.
Nav Bullets Styling
Style the nav dots size, color, spacing, and alignment.
Usage Examples
Here are some live use cases for the Mega Slider Widget.