Post List widget is one of our super easiest widgets. Even after that, if you have to go through a tough tour while using the widget, the doc below will show you the way of getting out of that.
Let’s start the doc section by section.
To Insert Widget
Inserting the widget is just a matter of dragging and dropping. As you see in the screenshot above, drag the Elementor Post List widget inside your page.
Using the Content Tab, you’ll be able to make a layout of a particular part of a website. And in this regard, some handy sections in the tab will assist you a lot.
Now, I’m going to show the sections of the Content Tab and how they work behind the list widget for posts.
Go to the Content tab > Layout.
Before using this widget, you’ve to make sure that you have enough post to show. Ok! Look at this section that includes a few switcher buttons. And using the buttons, you might easily manage the layout of the widget.
One more thing you can also calculate the column number and adjust the spacing here.
This section works for setting the source location of data that you need to display by the reference like Author, Categories, Tags, and Formats. The references can be different in accordance with the source location. Read more
A. Go to Source ➤ next select data location( such as Manual Selection)
B. Then, write category name in the Categories field.
C. Next, go for Posts Limit. For example, 2, 3, 5 like this.
D. Order By and Order controls are here to arrange the data you want to display through Random, Title, Date, or Category – wise and also with ascending or descending order.
Now, let’s work with Style Tab. The tab will easily have you style the web content (text, image, video, etc.) of the page you require to design.
Styling with the tab in Elementor will always give you a fantastic experience.
Let’s have a look.
First of all, go to the Style tab > Image. Then, under the Normal mode, you might adjust Image Size, Padding, Margin, Border Type and Radius, and Box Shadow.
Next thing is to add background to the image from the Background Type (Classic/ Gradient).
Another important thing is CSS Filters. Go to the Style tab > Image > CSS Filters.
But, you can also set opacity and transition to the image using the Opacity and Transition Duration scroll bar for the list widget for posts. See the image above.
Secondly, go to the Style tab > Image. After that, under the Hover mode, you’ll be able to add Background, Border color, CSS Filters.
Just, go to the Style tab > List Style.
This section will let you style title, date, category, and divider under the sub-section Title, Date, Category one by one on the Post List widget. See the image example above.
At the end of this documentation, I hope you’ve noticed what is Post List widget by Element Pack is and how it works for you. Watch the video inserted above. If you want to discover what more is possible to do using this one, you can visit the demo page.