Posts Widget (Pro)

🎯 What It Is

A powerful widget for displaying blog posts or any custom post types in a variety of styles and layouts. It fetches content dynamically and presents it within your design.

🚀 Core Features & Layout Styles

• Three Display Styles (Skins):

  • Classic: Traditional grid with post title, image, excerpt, and metadata—supports masonry layout.

  • Cards: A modern card-style layout with customizable badges, avatars, and visuals.

  • Full Content: Displays full post content along with featured image, ideal for blog pages or long-form content.

• Grid Control:

  • Adjust columns (1–6) and posts per page.

  • Enable/disable masonry layout.

  • Set featured image position (top, left, right, none).

  • Fine-tune image size, aspect ratio, and width.

  • Control excerpt length and visibility.

  • Include or hide metadata like author, date, comments, and separators.

  • Show or hide “Read More” button; customize its text with alignment options and dynamic tagging.

  • Optionally open posts in new tab.

🛠️ Query & Filtering

• Choose content source: Posts, Pages, Landing Pages, Custom post types, Manual selection, Current Query, or Related Posts.

• Include filters:

  • By author or specific terms (categories, tags, etc.)

  • Date ranges (today, last week, month, custom)

  • Order by date, title, menu, or random; ascending or descending

  • Option to ignore sticky posts

• Exclude filters:

  • Exclude current post, manual selections, or specific terms/authors

  • Avoid duplicate posts by skipping displayed ones elsewhere

  • Offset results, exclude by date, and manage sticky posts

• Advanced Query ID: Assign unique IDs for more complex or server-side filtering.

🔄 Pagination Controls

Choose how users navigate through multiple posts:

• None

• Page numbers

• Prev/Next

• Combined numbers + prev/next

• Load More (on click) with spinner and customizable button text

• Infinite Scroll with loading indicator and “no more posts” message

• Option to enable independent pagination on multiple widgets per page

🎨 Style Customization

Customize all visual aspects under the Style tab:

• Grid Spacing:

  • Set column and row gaps

  • Align widget container as left, center, or right

• Box/Card Styling:

  • Border width, radius, padding, background color, border color (normal and hover)

  • Box shadows and content padding

• Image Settings:

  • Image size, width, border radius on cards/full layouts

• Content Styling:

  • Typography and color for titles, excerpts, and metadata

  • Text shadow and spacing options

• Read More Button:

  • Text style, color, background, border, padding, and hover effects

  • Icon support and alignment

• Badge/Avatar Fields (Cards skin only):

  • Define typography, size, spacing, and positioning

• Pagination Styling:

  • Customize colors, borders, spacing, typography, size, and hover for pagination and load more/infinite options

📱 Responsive & Advanced Controls

• Responsive design support: adjust columns, gaps, and typography per device

• Advanced options: margin, padding, z-index, custom CSS, motion effects, and widget anchors

✅ Ideal Use Cases

• Blog or news pages

• Project or portfolio showcases

• Event listings

• Real estate or product directories

• Related post sections (with fallback for unmatched items)

💡 Best Practices

• Choose consistent image formats and aspect ratios for a clean look

• Use masonry layout for dynamic designs

• Clearly label titles and metadata for readability

• Enable friendly pagination (infinite or load more) if content is plentiful

• Use query filters to keep content relevant (e.g., specific categories or featured posts)

The Posts Widget in Elementor Pro delivers powerful capabilities for displaying dynamic content with control over layout, styling, and filtering—ideal for creating vibrant content-rich pages.