List Order

The List Order element allows to order items within "list" elements on the same page. It triggers the first found Post List (or Product List) element in the content area of the page (not in a header or footer).

List Order does not work with Grid, Term List, and User List elements.

Live example 1
Live example 2
Live example 3

List Order allows to re-order list elements based on the:

  • Date of creation (publication)
  • Date of update
  • Title
  • Comments
  • Post Type
  • Page Attributes: Order
  • ACF fields with the following types
    • Text
    • Number
    • Range
    • Select
    • Radio Buttons
    • Button Group
    • Date Picker
    • Date and Time Picker
  • Custom Field (with manual name setting)

WooCommerce plugin adds the following options:

  • Price
  • Rating
  • Sales

Post Views Counter plugin adds the following options:

  • Total views
  • Views today
  • Views this week
  • Views this month
  • Views this year

The Events Calendar plugin adds the following options:

  • Event Start Date
  • Event End Date

Change URL Parameters #

By default, the List Order changes the URL in a browser address bar. You can disable that behavior via the Change URL Params switch.

Switching the dropdown to any non-default value adds the _orderby parameter to the URL, for example:

http://example.com/my-list/?_orderby=date

It allows the creation of external links that lead to the list with the predefined sorting applied.

If you want the Post List / Product List will take into account URL params after page reloading, you need to enable the "Use URL params to show results" option in their settings.

FAQ #

How to add my own custom value for sorting? #

In case you're using ACF its supported fields are available for selection in List Order settings. In case you want some another custom field, just select the "Custom Field" in List Order settings and paste your desired field name.

WordPress doesn't allow to sort posts by taxonomies.

How to add sorting by multiple values? #

It's possible via custom PHP code using us_get_list_orderby_params and us_apply_orderby_to_list_query hooks.

Code Example

The code below will show the "Cheapest & Latest" value in the dropdown, and selecting that value will sort products by price and published date: if the prices of the products are the same, the last added product will be shown first.

add_filter( 'us_get_list_orderby_params', function( $params ) {
	$params['my_param_name'] = array(
		'label' => 'Cheapest & Latest', // shown on the frontend
		'group' => 'Custom order values', // shown in List Order settings only
	);
	return $params;
} );

add_filter( 'us_apply_orderby_to_list_query', function( $query_args, $orderby ) {
    if ( $orderby == 'my_param_name' ) {
        $query_args['meta_key'] = '_price';
        $query_args['orderby'] = array(
            'meta_value_num' => 'ASC',
            'date' => 'DESC',
        );
    }
    return $query_args;
}, 10, 2 );

Note that the my_param_name should be unique as it will be used as URL param.

This example does not apply to sorting by multiple custom fields, since WordPress doesn't allow this without modifying the meta_query