The pro version of Elementor comes with a widget called Posts. You can use this widget to display the existing articles on your website. By default, the Posts widget displays the newest articles on your website, but you can filter the articles by certain parameters.
Some premium Elementor add-ons such as Essential Addons and JetElements also have a similar widget, but the native Posts widget of Elementor supports more filtering options.
You can use the Posts widget anywhere on your website. Whether on the homepage, on a category page, on an archive page, on the footer, on the sidebar, and so on. You can even use the widget to display the related articles on the single post template.
How to Use the Posts Widget of Elementor
Before getting started, just make sure that you have installed and activated the pro version of Elementor since the Posts widget is only available on the pro version.
Create a new page, post or template with Elementor. On the Elementor front-end editor, add a new section add drag the Posts widget to the section. You can find the Posts on the PRO block on the left panel.
As you can see, the widget will display the last articles on your website once you added it.
Filtering the Articles
To filter the articles, you can open the Query block under the Content tab. In addition to displaying the articles (posts), you can also use the Posts widget to display pages and WooCommerce products. You can set the content type (post, page or product) you want to display from the Source option.
Filter the Articles by Category and Tag
To filter articles by category or tag, click the Include By field and select Term. A Term field will appear afterward. Enter the category name or tag name you want and select from the appearing list.
You can add multiple categories or tags.
If you leave the Include By field empty, the Posts widget will display all articles on your website. You can hide articles in certain categories or tags by entering the categories or tags on the EXCLUDE tab.
Filter the Articles by Author
To filter the articles by author, simply select Author on the Include By field and enter the name of the author on the appearing field. You can add multiple authors.
To hide articles from certain authors, you can go to the EXCLUDE tab.
Select the Articles Manually
In addition to filtering the articles by category, tag, and author, you can also add the articles manually. This option is great if you want to display a featured article on the homepage or anywhere you want.
To add articles manually, select Manual Selection on the Source option and enter the title of the articles you want to display on the Search & Select field.
You can add multiple articles to be displayed.
Setting the Layout
After filtering the articles, you can set the layout. Open the Layout block under the Content tab. As you can see, there are several options you can set. You can set the skin, the number of columns to display your articles, posts per page, image position, image size, image ratio, excerpt length, and post meta.
Setting the Pagination
To set the pagination, open the Pagination block under the Content tab. There are three pagination types offered by the Posts widget: Numbers, Next/Previous, and the combination of the two.
A little note. The number on the Page Limit field controls the number of pages that can be accessed, not the number of articles. If you have 100 articles and you set the number to 5 — while you set the articles per page to 6 — the maximum articles can be accessed are 30 (6 x 5).
Styling the Widget
As usual, you can go to the Style tab to style the Posts widget. There are five blocks you can open.
Layout block
On this block, you can set the gap between columns and rows. You can also set the alignment of the content.
Box Block
On this block, you can set the border width of the box, border radius, border color, padding, content padding, box shadow, and background of the box.
Image Block
On this block, you can set border radius of the featured images of the articles as well as the gap between each featured image to the content. You can also apply some CSS filters if you want.
Content Block
On the Content block, you can customize the style of the content (Title, Meta, Excerpt, Read More). You can set the text color, typography (font size, font style, font family) and the spacing.
Pagination Block
You can style the pagination on this block. You can set the typography (font size, font style, font family), text color, and space between numbers. When setting the text color, you can set different colors for the normal condition, mouse hover and active.
If you want to set the padding and the margin of the Posts widget, you can go to the Advanced tab. To save time in styling the widget, you might want to install WunderWP. This plugin has 5 presets you can choose from.
The Bottom Line
You can use the Posts widget of Elementor to display the existing articles on your website. If you use your website to sell something via WooCommerce, you can also display products. This widget has a filtering feature that allows you to filter the articles by certain parameters. You can use the Posts widget on any part of your website.
