Kadence Query Loop (Adv) Sort By Custom Post Type Field

Recently, I worked with a client who needed a way to display their custom “Vehicle” post type, sorted by a “Price” field, on their WordPress site. They had created the custom post type using Pods, and while the Kadence Advanced Query Loop block was perfect for displaying the posts, the built-in sort options didn’t include their custom “Price” field.

Fortunately, with a simple code snippet, we were able to solve this problem. Here’s how you can do it too if you’re facing a similar challenge!

The Challenge

My client’s “Vehicle” custom post type had a numeric “Price” field, and they wanted visitors to sort the vehicles by price using the Kadence Sort Filter block. However, custom fields like “Price” don’t appear as sortable options out of the box in the Advanced Query Loop settings. Since I already had the WPCode plugin installed (a handy tool for adding custom snippets), I knew we could tweak the query with some PHP to make this work.

The Solution: Customizing the Query with a Code Snippet

To sort the vehicles by the “Price” field, we need to modify the Advanced Query Loop’s query parameters. Kadence provides a filter called kadence_blocks_pro_query_loop_query_vars that lets us do just that. By adding a snippet to target the specific query and adjust its sorting behavior, we can make the “Price” field sortable. Here’s the step-by-step process:

1. Identify Your Query ID: First, find the ID of your Advanced Query Loop. In the WordPress admin, go to Kadence Blocks > All Queries, hover over the edit link for your query, and note the post ID from the URL (e.g., post=1234). This ensures the snippet only affects the intended query.
2. Add the Code Snippet: Using the WPCode plugin (or your preferred method for adding PHP), insert the following code. Replace 1234 with your query ID and adjust the meta_key if your field name differs from “price”.

<?php
add_filter( 'kadence_blocks_pro_query_loop_query_vars', function( $query, $ql_query_meta, $ql_id ) {
    if ( $ql_id == 1234 ) { // Replace 1234 with your Query Loop ID
        $query['orderby'] = 'meta_value_num'; // Use meta_value_num for numeric fields
        $query['meta_key'] = 'price'; // Your custom field name
        $query['order'] = 'DESC'; // DESC for high-to-low, ASC for low-to-high
    }
    return $query;
}, 10, 3 );
?>

Explanation:

• $ql_id == 1234: This targets the specific Advanced Query Loop instance. Without this condition, the snippet would apply to all queries on your site, which isn’t what we want.
• 'orderby' => 'meta_value_num': Since “Price” is numeric, we use meta_value_num to ensure proper sorting (use meta_value for text-based fields).
• 'meta_key' => 'price': This tells the query to sort by the “Price” field from your custom post type.
• 'order' => 'DESC': This sorts from highest to lowest price. Switch to 'ASC' for lowest to highest.

Testing and Fine-Tuning

After adding the snippet, refresh your page with the Advanced Query Loop block. The vehicles should now display sorted by price. If you’re using the Kadence Sort Filter block, it will respect this query modification, allowing users to toggle between ascending and descending order. If the sorting doesn’t work as expected, double-check:

• The Query ID matches your loop.
• The meta_key matches your field name exactly (case-sensitive).
• The field contains numeric data if using meta_value_num.

Wrapping Up

With this approach, my client’s vehicle listings now sort beautifully by price, giving their users a seamless browsing experience. This method is flexible too—you can adapt it for any numeric or text-based custom field in your projects. If you’re using Pods or another custom field plugin with Kadence Blocks Pro, this snippet is a game-changer for unlocking advanced sorting capabilities.

Have a different custom field or post type you need to sort? Drop a comment below, and I’ll guide you through tweaking the snippet to fit your needs!