Work Services Journal About Contact
Warsaw [email protected]

How to Fix an Elementor Loop Grid That Ignores Your Sort Order

You set the Order By option on an Elementor Pro Loop Grid, save the page, and the posts come out in the wrong order anyway. This bites hardest on archive and custom post type templates, where the grid follows the current query and your sort choice in the widget just gets ignored. It is one of those bugs that makes you doubt your own eyes. Here is the snippet I use to take back control and sort an Elementor Loop Grid exactly how I want.

Why the Loop Grid ignores your sort order

When a Loop Grid inherits the page's main query (the current query on an archive or search template), the widget's own Order By and Order controls do not reliably win. WordPress has already built that query before Elementor renders, and the grid displays whatever it is handed. Fighting the widget UI is a losing game here. The clean way around it is to drive the ordering in code instead, and Elementor gives us a hook for exactly that.

The fix: a custom query hook

Elementor lets you name a Custom Query on the Loop Grid, then filter it with elementor/query/{your-id}. You set the ID once in the widget, and the snippet forces the orderby and order on that query. This example orders posts alphabetically by title, ascending:

add_action( 'elementor/query/custom-order', function( $query ) {
    // Order by title, A to Z
    $query->set( 'orderby', 'title' );
    $query->set( 'order', 'ASC' );
});

The key is that the hook name and the Custom Query ID have to match exactly. Elementor looks up your ID, finds the matching action, and lets you rewrite the WP_Query arguments before it runs. Swap the values for whatever you need. A few common ones:

// Newest first
$query->set( 'orderby', 'date' );
$query->set( 'order', 'DESC' );

// Manual order (drag-and-drop menu order)
$query->set( 'orderby', 'menu_order' );
$query->set( 'order', 'ASC' );

You can push this further and set meta_key plus orderby as meta_value_num to sort by a custom field, which is handy for things like price or a manual priority number on a custom post type. Anything that is valid inside a WP_Query is fair game here.

How to wire it up

  1. Install and activate the Code Snippets plugin.
  2. Go to Snippets > Add New and paste the snippet.
  3. Set it to run everywhere and activate. I never touch functions.php: Code Snippets survives theme updates, and I can toggle it off in a click if anything looks off.
  4. Edit your page, select the Loop Grid, and open the Query settings.
  5. In the Custom Query ID field, enter custom-order (or whatever ID you used in the hook).

The string custom-order is just an example. Use any ID you like, as long as it matches in both the hook name and the widget field. That also means you can run several grids on one site, each with its own sort rule, without them clashing.

Still works in 2026

The elementor/query/{id} hook is a long-standing part of Elementor Pro and still works on the current release in 2026. Because the sort logic lives in a snippet rather than the widget, it keeps working even when you restyle or rebuild the grid later.

The snippet lives on GitHub: djaysan/elementor-enable-sort-on-loop-grid-current-query. Star or fork it if it saves you a headache. Credit to Imran from WebSquadron for the original approach.

Building an Elementor site with fiddly archive queries? Get in touch.

Let’s build

Have a project in mind?

Get in touch