Elementor: How To Sort Posts Based On A Custom Date Field

When you use the Posts widget from Elementor, it allows you to order your posts by title, date, menu order, or random. However, what if you wanted to sort them based on a custom field date, used by Advanced Custom Fields or ACF?

You now can by doing the following:

  1. Be sure to have a custom date field created. In our example, we use, “event_departure_date”.
  2. Go to the page/template in Elementor that you want your posts widget on. Give a name in the “Query ID” field. In our example, we use, “event_sort_date”.
  3. Lastly, go to your theme’s functions.php file and add the following code:
    /* Sort Posts by Custom Date Field */
    add_action( 'elementor/query/event_sort_date', function( $query ) {
    $query->set( 'meta_key', 'event_departure_date' );
    $query->set( 'orderby', 'meta_value_num' );
    $query->set( 'order', 'ASC' );
    });
    

Be sure to change “event_departure_date” and “event_sort_date” to your own.

Other Helpful Articles

Disable Product Pages in WooCommerce

Add the following code to your functions.php file to disable users from accessing product pages within WooCommerce: /* Remove Links to Access Product Pages */ remove_action( ‘woocommerce_before_shop_loop_item’, ‘woocommerce_template_loop_product_link_open’, 10 ); remove_action( ‘woocommerce_after_shop_loop_item’, ‘woocommerce_template_loop_product_link_close’, 5 ); /* Prevent Users from Accessing Product Pages by Displaying the 404 Page */ function prevent_access_to_product_page(){

Read More »
Smart Web Creative - Knowledge Base - How to Recover WordPress Additional CSS

How to Recover WordPress Additional CSS

How to Recover WordPress Additional CSS in 2023 (Step-by-Step) – If you have ever lost additional CSS within your WordPress theme, we’ll show you how you can most likely recover it in this step-by-step tutorial. First, we will go over what CSS is, how you can add custom CSS in

Read More »
Smart Web Creative - Quick Resources: Date and Time in PHP

Quick Resources: Date and Time in PHP

If you want to display the date and time in PHP, it can be somewhat confusing what letters to use to bring in those elements. Below is a list of all the PHP date and time options that you can use on your site: To utilize these options in PHP,

Read More »

What Do You Need Done?:

(Please check all that apply)

Tell Us About You

Almost Done!

Let's Get Some Info

Let's Get Some Info

Let's Get Some Info

Let's Get Some Info

Let's Get Some Info

Let's Get Some Info