Creating Post Slider/Carousel using AnyWhere Elementor Pro
You can use Post Blocks widget to create the Post Slider.
Note: You will need "AnyWhere Elementor Pro" ver 2.8 or greater for this.
The process of creating Post Slider using Post Block widget includes 2 stages.
- Preparing design of the individual slide (using Block Layout)
- Using Block layout created in the step above to create Post Slider or even carousel.
Preparing the layout of single Slide
Here is a sample slide layout for reference. It includes Post Title, Post Excerpt, and a Read More button.
Follow the steps below to design a block layout (layout for a Slide)
- Go to AE Template -> Add New
- Add a suitable title and do configuration as mentioned below.
- Render Mode: Block Layout
- Preview Post: Select a post that you want to see as a preview while designing the layout in the Editor.
- Also, select Template as "Elementor Canvas" so that you will get the plain canvas to design the layout.
- Now click on "Edit with Elementor" to design this layout in Elementor editor.
- In Elementor drag widgets Title, Post Excerpt, and Post Readmore. Place them and design as per your layout.
- You can add featured images to section background.
- Give proper height, padding to the main section of the slider. Make sure to design it all in one main section and used a child section or columns as required.
-
Once it is complete then just save and you can now exit this editor.
-
It's half done. You have completed designing the layout of a slide for your Post Slider.
Adding Post Slider to your Page/Post
- Open the page on which you want to add Post Slider in Elementor editor mode.
- Drag AE - Post Blocks widget at the desired location in your layout.
- Now you will see the Block layout you have created under Block Layout dropdown.
- Under the "Query" section set all options to define the source of the Posts to be used in Slider.
-
Under the "Layout" section define the way you want to display your posts.
-
There are multiple options available like Grid, List & Carousel. For Slider, you will have to select the Carousel and set the number of slides below to 1.
-
Once you have selected Carousel as layout, you will see another section below "Carousel". There you will get a lot of other options to configure the carousel (like speed, navigation controls, effects, etc. )
-
Configure these options as per your requirement. You will also get a lot of styling options under the Style tab to change the color and size of slider controls.