Masonry Layout für WooCommerce Produkte

Um auf der Shopseite oder in Kategorie-Archiven von WooCommerce die Artikel im Masonry Layout aufzulisten, hilft folgende Funktion im Childtheme

// Load isotope scripts on the shop pages
add_action( 'wp_footer', function() {
	if ( wpex_is_woo_shop() || wpex_is_woo_tax() ) {
		wpex_enqueue_isotope_scripts();
	}
} );

// Add masonry classname to WooCommerce grid
add_filter( 'wpex_woo_loop_wrap_classes', function( $classes ) {
	if ( is_array( $classes ) ) {
		$classes[] = 'wpex-masonry-grid';
	} else {
		$classes .= ' wpex-masonry-grid';
	}
	return $classes;
} );

// Add masonry class to woo entries
add_filter( 'post_class', function( $classes, $class = '', $post_id = '' ) {
	if ( wpex_is_woo_shop() || wpex_is_woo_tax() ) {
		$classes[] = 'isotope-entry';
	}
	return $classes;
}, 60, 3 );

Quelle: https://wpexplorer-themes.com/total/snippets/apply-masonry-layout-to-woocommerce-shop/