Preserving Product Display Order in WooCommerce Shortcodes
when using the
[products]
shortcode in WooCommerce, the products are typically retrieved in a specific order based on the ‘orderby’ parameter. If you’d like to display the products in the exact order of the IDs provided in the shortcode, you’ll need to customize the behavior.
Here’s how you can achieve this:
Custom Code to Preserve ID Order: Add the following code to your theme’s functions.php
file or a custom functionality plugin:
add_filter( 'woocommerce_shortcode_products_query', 'custom_woocommerce_shortcode_products_orderby', 10, 3 );
function custom_woocommerce_shortcode_products_orderby( $query_args, $atts, $loop_name ) {
if ( 'product' === $loop_name ) {
if ( ! empty( $atts['ids'] ) ) {
$query_args['orderby'] = 'post__in';
}
}
return $query_args;
}
What this code does is check if the shortcode being used is the
[products]
shortcode, and if the ids
parameter is set. If both conditions are met, it modifies the orderby
parameter to be post__in
, which means the products will be ordered in the same order they appear in the ids
list.
Using the Shortcode: Once the above code is in place, you can use the shortcode as you have been:
[products ids="53,68,1"]
And the products will be displayed in the exact order of the IDs: 53, then 68, then 1
Remember, when making code changes, it’s always a good idea to have a backup in place and preferably test changes on a staging site first. Also, if you are using a third-party theme, it might be beneficial to use a child theme so that your changes don’t get overwritten when the theme updates.