How to use Query Filter in Anywhere Elementor Pro?

One of the most exciting features of Anywhere Elementor Pro is the Post Blocks widget. It allows you to display post collections on your WordPress websites using your own custom design skins built with Elementor. In addition, the widget gives you many advanced features and the options to filter your posts, custom post types, and taxonomies. It’s easy to use and provides extensive features that allow you to build beautiful Post Block layouts without any coding knowledge.

Post Block Advanced widget

There are a lot of options for customizing the post-collection. With its powerful query builder, you can choose which posts to display and customize them according to your needs. Moreover, the widget provides attractive layout design options and robust query filter options. Furthermore, this widget offers an ultimate layout design option to use your customized block layout. It gives you three skins, grid, carousel, and accordion. More options are available under grid skin, and you can use list, smart grid, and checkerboard. Wow, by using this, you can create a stunning layout. Isn’t it cool?

Well, the query section of this widget is as powerful as its layout section. There are multiple sources from which you can choose post type as per your need. Like post, pages, custom post type, current archive, related post, and even ACF fields like Relationship, post object. You can also make a manual selection. In the manual selection, you can choose specific posts to display.

You can also filter them based on taxonomy like category, tags, custom taxonomy. You can also include or exclude your post collection based on the author. You can quickly sort them ascending or descending by date, title, custom field etc.

You can also define how many posts you want to display on a page and choose pagination or infinite scroll to show more posts.

For example, you created two custom post types, and now you want to display the result on the same page with different designs or layouts. You can quickly achieve this with our Post block advanced widget. But, First, you need to create 2 different block layouts. And on the desired page, you need to drag two Post block advanced widgets and tweak some settings as per your need, like choosing different skins, your own block layout, and different source type. And that’s enough to achieve the required result.

However, sometimes you might come across situations where you need a more complex query not feasible through these available controls.

We have covered you with an interesting feature to handle such cases – Query Filter. It allows you to bind your own query parameters with the already constructed query. Before we dive more into it, First, take a look at how it works behind the scene.

In the code, this widget uses the WordPress provided WP_Query class to fetch posts from the database (based on the option that you choose in the query section).

An array of arguments are passed while calling this class, and it returns the desired result. Our query filter functionality allows you to modify that array of arguments based on your requirement.

So let’s first understand what is WP_Query,

What is WP_Query?

WP_Query is a popular class available in WordPress. This allows us to fetch data directly from the database. It takes an array of arguments that contains information about which posts are to be fetched.

Below is an example of a simple WP_Query that displays posts by author, using author id:

$query = new WP_Query( array( 'author' => 4 ) );

This simple wp_query code with multiple arguments passed will display published posts ordered by date.

<?php
 
// The Query
$args = array(
    'post_type'      => 'post',
    'post_status'    => 'publish', // Also support: pending, draft, auto-draft, future, private, inherit, trash, any
   'posts_per_page'  => '5', // use -1 for all post
    'order'          => 'DESC', // Also support: ASC
    'orderby'        => 'date',
   ),
);
$the_query = new WP_Query( $args );

Uses of WP_Query with Post Block Advanced widget of Anywhere Elementor Pro

Here we will take an example case to show your featured posts using the Post Blocks Advanced widget. Suppose you created a custom field (checkbox) to mark the post as featured.

Now follow these steps to add your own filter to the Post Block query.

First, find the option “Query Filter.” under the “Query” section.

Make sure you have read the description (warning message) below that field. Add your custom filter name in that field. In this case, we have placed “featured_posts.”

Now we will need to attach the filter to this function in functions.php of the active child theme.  

See the following code that we have added to fetch only those posts which are marked as featured.

function ae_get_featured_posts($query_args){
   $query_args['meta_key'] = 'is_featured';
   $query_args['meta_value'] = 1;
   return $query_args;
}
 add_filter('featured_posts', 'ae_featured_posts');

If you notice in the above code, we have added a filter to “my_custom_filter.” This function will receive “$query_args” as an argument that will be passed in WP_Query by the Post Blocks Advanced widget. You can modify it and return it from that filter. Here we have added a meta_key related filter to show only those posts that have meta_key “is_featured” set with “meta_value” = 1.

Now, let’s have a look at a more complex example like using a meta query in the Query filter. See the following code that we have added to fetch only upcoming posts.

function ae_get_upcoming_events($query_args){
  $meta_query[] = array(
        'key' => 'current_date',
        'value' => date('Y-m-d'), //today's date
        'compare' => '>', 
        'type' => 'date'
    );

 $query_args['meta_query'] = $meta_query;

    return $query_args;
}
add_filter('upcoming_events', 'ae_get_upcoming_events');

In the above code, we have added a function ae_get_upcoming_events, that you need to use in the Query filter of Anywhere Elementor Pro and place this code to function.php of your active child theme.

Here we are fetching a list of all upcoming events by comparing dates from today.

Wrap up

These were just a few possibilities that we have shown you in the above examples. Query filter has endless possibilities, but you need to have a proper understanding of the query filter how it works. Click here to know more about WP_Query. and if you have any special cases to use in the Query filter, please reach out to our support team.

To use customized Query filter in Post Blocks Advanced widget get Anywhere Elementor Pro.