Peter
What you’ll need to display Elementor slider from templates
01
Free version of Premium Addons for Elementor, you can find this in your WordPress repository. This plugin will enable you to use the Carousel Widget.
Templates to use in your slider. You will learn how to create these in step 2.
Step 1: Activating the Slides Widget
02
To start off, go to your Dashboard and create a new page; give it a name, then click the Edit with Elementor button.
Inside the Elementor Editor, go to the Slides Widget and drag it to your editor window. The slides widget however only allows you a few options, that is; to add content as text, and to style, it does not provide you with the option to load in Elementor templates.
Step 2: Activating Carousel Widget
03
In order to be able to load your templates into the slides widget, you need a third party addon from the Premium Addons for Elementor which you should have installed from earlier and it should be in your plugins.
Under this Premium Addons for Elementor, go to widgets and enable the carousel widget (make sure it is turned on or it is green). By enabling the carousel widget you will now be able to access it in the Editor.
After activating your carousel widget you go back to the Editor, go to the widgets section and search for the carousel widget, get the Premium Carousel and drag it to your edit window.
Step 3: Loading Templates in Slider
04
Now that your carousel widget is ready, you need to load templates into it.
For starters, you need to create the templates that you’ll be showcasing in the carousel. To do this: Go back to Elementor menu, go to the templates option on the left side, click the “Add new” button, choose template type to be section then give it a name and click the “create template” button.
Now you can start creating your section and add any content you want to display in your section/template, then you can click on the edit section button and say “save as template”, give it a name and save. This will save the new template inside the templates folder and that way you’ll be able to echo it inside the carousel.
Make sure the section you’ve created is responsive on all devices so that it can be viewed on mobile devices too. After creating all your templates and adding content to your satisfaction, the next step is to:
Go to content type, select repeater, go to templates option down and click “add item”, here you can add all your created templates that you want to display in your slider. Under the Layout option; make sure the section is full width if your templates are full width. Next, remove column gap so that there’s no space on top and on the sides of the column.
Click Publish and have a look! You may also be interested in checking out how to use Elementor widgets to navigate carousel slides
Step 4: Adding Navigation Arrows
05
Now that your slider is up and running, you need to now work on the navigation arrows. To do this:
Go to the editor and select Premium Carousel widget, go to the left side, here turn off the dots and turn on the arrows for navigation. Under style, change the arrow colour to white and grey colour on hover.
Edit size to 30 pixels and position it to your preference. Go back to Editor and click Update then go to the live page and view the result. Under the content option you can also set your slider settings to any way you want them to transition in and out.
You can also change navigation of slides from horizontal to vertical. Do this by going to type, switch from horizontal to vertical. Now you can load your slides into Elementor using templates! Hope you’ve found this tutorial helpful.
Remember to subscribe to my YouTube channel and my newsletter. For any suggestions or questions about this tutorial please let me know in the comments section below.
Video: Display Elementor Slider from Templates for Free
Check out more on this story on the link below.