Snippet: Prevent White Space in Masonry Layouts by Ignoring Item Order

  • Updated:
Important: We are looking to add a built-in setting to various elements (Image Grid, Post Cards & Term Cards) so you don't need a snippet. Before adding any code to your site please check to make sure the setting doesn't already exist in the element. It would be located near the field where you select "Masonry" as your grid style.

By default, the masonry script in the theme aims to maintain the order of your items, which is especially important for posts that you may want to display in a specific order, such as by published date or title. If the masonry script were to place items in any available empty space, it could disrupt this order.

However, in some cases, you might not be concerned with the sorting order and would prefer not to have any empty space, letting images be positioned wherever there's available room. The following code snippet can be used to modify the masonry layout so that items are placed in any available space, regardless of their original order.

add_filter( 'wpex_masonry_settings', function( $settings ) {
	$settings['masonry']['horizontalOrder'] = 0;
	return $settings;
} );
All PHP snippets should be added via child theme's functions.php file or via a plugin.
We recommend Code Snippets (100% Free) or WPCode (sponsored)
Back To Top