Filterable Posts

The Filterable Posts Widget in Animation Addons for Elementor is a paid feature. To access this widget, ensure the plugin is installed and activated on your site. You can also explore both free and pro widgets through the filtering options.

Introduction

The Filterable Posts Widget lets you display and sort posts dynamically, enhancing content organization and user experience.

Key Use Cases for the Filterable Posts Widget:

• Display and sort posts dynamically for better content organization.
• Customize styling to match your site’s design seamlessly.

Prerequisite

• Elementor
• Animation Addons for Elementor

How to Activate the Filterable Posts Widget?

• Go to Animation Addons → Elements in your WordPress dashboard.
• Find the Filterable Posts Widget in the list.
• Toggle it on to enable the widget.
• Now, the Filterable Posts Widget is ready to use!

How to Add Filterable Posts Widget in Elementor

• Open the page where you want to add the Filterable Posts Widget.
• Launch the Elementor editor.
• In the Elementor panel, search for “Filterable Posts Widget”.
• Drag the widget to your desired section.
• The Filterable Posts Widget is now ready for customization.

How to Configure Filterable Posts Widget

Enable it, create a new page, set a title, choose the Elementor Full Width template, and publish. Adjust options as needed.

• Make sure the Filterable Posts Widget is activated in your Elementor settings.
• Open a new page in WordPress.
• Add a page title and choose the Elementor Full Width template.
• Click Publish to save your changes.
• In the Elementor panel, search for “Filterable Posts Widget” and drag it onto the page.
• Adjust filters, post sources, layout, and style as needed.

Configuring Filterable Posts Widget : A Step-by-Step Guide

Once the Filterable Posts Widget is added to your page, you can configure its settings under different tabs: Content,Style and Advanced.

Content Settings

In the Elementor Editor, under the Content tab of the Filterable Posts Widget, you’ll find the following configurable sections:

• Filter: Enable and customize filter tabs for post categories or tags.
• Query: Define which posts to display based on source, category, tags, or custom queries.
• Layout: Choose grid, masonry, or other display layouts.
• Settings: Control post count, image size, and display toggles (author, date, etc.).
• Title: Manage visibility and styling options for post titles.
• Excerpt: Display a short preview of each post with length control.

• Taxonomy: Show assigned categories or tags with customization.
• Meta: Toggle metadata like author, date, and customize its appearance.
• Read More: Enable and style a call-to-action link to full post content.
• Pagination: Add pagination controls to navigate through multiple post pages.

You’ll find even more customization options under each setting. So go ahead, explore them, and see the difference!

Style Settings

In the style section, I only made changes to the filter section only, while the rest remained unchanged as I don’t need them right now. 

• Filter: Customize the appearance of filter buttons, including color, typography, and spacing.
• Layout: Adjust the overall design, alignment, and spacing of the post slider layout.
• Thumbnail: Style the post thumbnail by setting dimensions, border radius, and hover effects.
• Title: Change the typography, color, and spacing of the post titles.

• Excerpt: Style the excerpt text by adjusting font size, color, and spacing.
• Taxonomy: Customize the look of categories or tags, including font, color, and background styles.
• Meta: Style metadata like author name and date with typography and color settings.
• Meta Admin: Adjust the appearance of admin-specific metadata fields if displayed.
• Read More: Style the “Read More” button or link, including typography, colors, background, and hover effects.

Advanced Settings

In the advanced settings, you’ll find a variety of advanced features designed to enhance your designs. Experiment with these options and experience the difference they make.

Final Outcome

That’s it! You’ve successfully learned how to configure the Filterable Posts Widget in Elementor to display dynamic and categorized posts seamlessly.

For any further assistance or inquiries, feel free to contact our support.