Halloween 40% off every Pro plan. Lifetime from $51, pay once.40% off Pro Vanishes in Claim40% off
Classic Elementor widget · Free

Posts Widget for Elementor: A free blog grid with six post card styles

Add a blog section to any Elementor page in a few clicks. The free Elementor posts widget turns your latest articles into post cards: pick one of six styles, choose the columns, show the categories, date, author and a Read More link, and give every image a hover effect. It works as a free Elementor blog grid, and page numbers let readers browse older posts.

  • 6 post card styles
  • Free on WordPress.org
  • 4 image hover effects
  • Numbers + Previous/Next

Classic widget · Elementor 3 and 4Updated

Live demos

Seven blog grids, live

Seven blog sections on small sites, from a three column grid to a list with page numbers. Hover a card to see the image zoom, and click the page numbers in the last one.

Product blog

A three column blog grid

The blog page of a software company. Three post cards in a row, each with category chips, a large title and a Read More link. The image zooms a little when you point at a card.

Hover a card

In the panel, set Style to One, Columns to 3, Show Taxonomy to Show and Hover Effect to Zoom In.

Fashion stories

Photo beside a dark text panel

The stories page of a fashion label. Each post has a portrait photo and a dark panel with the date, the title and a white Read More button that turns dark on hover.

Hover Read More

In Layout, set Style to Two, Columns to 2 and turn on Show Date. Keep Highlited Title on and set its Title Length to 3, so the first three words stand out.

Interior journal

Text panel over the photo edge

The journal of an interior studio. A large photo with the text panel overlapping its lower edge shows the date, the comment count and the title.

Hover a photo

In the panel, set Style to Three, Columns to 2, Show Date to Show and Show Comment to Show.

Film journal

Title on top of the photo

The journal of a production company. The photo fills the card and the text sits on top. On hover the tint deepens and the image zooms in, so the title stays easy to read.

Hover a card

In the panel, set Style to Four, Columns to 3, Icon Position to After and Hover Effect to Zoom In.

Photography blog

Tall photo with an overlapping box

The journal of a photo studio. A tall portrait photo with a dark text box that overlaps it from the side, with the date, the comment count, the title and an underlined Read More.

Hover a photo

In the panel, set Style to Five, Show Date to Show, Show Comment to Show and Hover Effect to Zoom In.

Wine estate news

Six posts with white chips

The journal of a wine estate. Six posts in a grid with white category chips, bold uppercase titles and the date, and no Read More link.

Hover a card

In the panel, set Style to One, Posts Per Page to 6, Read More to Hide and Show Date to Show.

Clinic talks

A post list with page numbers

The talks page of a clinic. A list with a date column, a thumbnail with a video, audio or gallery badge, the author and the views, and page numbers below. Click a number to see the next posts.

Switch pages

Set Style to Six and Posts Per Page to 3. In Pagination, choose Numbers + Previous/Next. The badges on the photos come from Video Icon, Audio Icon and Gallery Icon.

Features

Key features of the Posts Widget

What the Elementor post grid gives you, each feature tied to a setting in the Elementor panel.

Six styles and custom layouts

Pick one of six Elementor blog layout styles in Style, from One to Six, then set Columns per screen size, Posts Per Page and the Image Resolution.

Titles you control

Show or hide the title, cut it with Title Length (words) or Title Length (lines), pick the Title HTML Tag and make the first words bolder.

Excerpts that fit the card

Turn on Show Excerpt and set the Excerpt Length so each Elementor post card shows just enough to invite a click.

Meta information on demand

Switch Show Date, Show Comment, Show Author and Show Taxonomy on or off, and choose which taxonomy to list.

Read More with an icon

For an Elementor posts read more button, turn on Read More, change the Read More Text, add an Icon before or after it and set the Icon Spacing.

Post query controls

Use Query Type Custom, Archive or Related, pick the Source, include or exclude terms or authors to show Elementor posts by category, filter by Post Format and Date, and set the order.

Page numbers in two styles

For Elementor posts pagination, set Pagination to Numbers + Previous/Next, choose style One or Two, a Page Limit and Shorten for long archives.

Image hover and styling

Give images an Elementor posts hover effect with Hover Effect (Zoom In, Zoom Out, Left Move, Right Move) and style the thumbnail, content box, title, taxonomy, meta and Read More, with a separate background for even items.

Step by step

How to add a blog grid in Elementor

Five steps, all in the free plugin. The bold names are the labels in the Elementor panel.

  1. Install and activate Animation Addons for Elementor from WordPress.org, and make sure Posts is on under Animation Addons → Elements.

  2. Open your page in Elementor, search the panel for Posts and drag the widget into a section.

  3. In Layout, choose a Style, the Columns and Posts Per Page, then switch on the parts each card should show.

  4. In Query, pick the Source and the terms, authors or post formats to include, and set Order By.

  5. Add page numbers in Pagination, pick a Hover Effect in the Style tab, check the grid on mobile and publish.

Try it free Free on WordPress.org · Works with Elementor Free
FAQ

Questions about the Posts Widget

How to display blog posts in Elementor for free?

Install Animation Addons for Elementor from WordPress.org and add the Posts widget. It lists your posts as cards in one of six styles and works with Elementor Free.

Is the Posts widget really free?

Yes. It is part of the free Animation Addons plugin on WordPress.org. You do not need Animation Addons Pro or Elementor Pro to use it.

How is it different from Elementor Pro's Posts widget?

Elementor Pro's Posts widget needs Elementor Pro and offers Classic, Cards and Full Content skins. This widget is free, has six styles and adds image hover effects and title highlights.

How do I show my latest posts in Elementor?

Add the Posts widget and keep Order By on Date with Order on DESC. It then works as Elementor latest posts, and set to 3 posts it makes a small Elementor recent posts widget.

How do I show posts from one category?

In Query, use Include By Term and add the term IDs. That gives you Elementor posts by category. Exclude By removes terms or authors you do not want.

Can I make a blog grid with three columns?

Yes. Set Columns to 3 for desktop and pick fewer for tablet and mobile. Posts Per Page sets how many post cards appear in the grid.

Does it have Load More or infinite scroll?

No. The free widget offers Numbers + Previous/Next pagination in two styles. Load More and infinite scroll are in Advanced Posts, part of Animation Addons Pro.

Can it show custom post types?

Yes. For an Elementor posts custom post type setup, set the Source in Query to any public post type, such as pages or products. The posts then use the same cards and styles.

Which hover effects can the images use?

Four: Zoom In, Zoom Out, Left Move and Right Move, set in Hover Effect in the Style tab. Zoom In is the default; choose None to turn it off.

Does it work in Elementor 4?

Yes. It is a classic widget, so Elementor 4 lists it with the legacy widgets, and it works on the same page as atomic elements.

Animation Addons Pro · Elementor 4

Your blog, in six styles

A free post grid for Elementor with hover effects, post meta and page numbers.

Halloween deal40% off every Pro planEnds 5 Nov

  • 15-day money-back guarantee
  • Rated 4.6 / 5 on WordPress.org
  • No Elementor Pro needed
  • Elementor 3 & 4 in one license