WP Grid Builder has been for some time now my preferred way to add filters to your WordPress site. Filtering posts of any kind by categories or custom taxonomies, adding search fields and more can all be done with WP Grid Builder facets.

In this tutorial, I show you how to get WP Grid Builder working with the GenerateBlocks Query Loop element. Out of the box, it doesn’t quite work due to requiring an additional query argument, but I’ll provide you the code to get it working.

To quickly recap the steps required:

• Ensure your Query Loop element’s Grid has two classes: wpgb-query and wpgb-content-1
• In WP Grid Builder settings, ensure “Filter Custom Content” is enabled
• Create your WP GB Facet and note its shortcode. Change the grid= in the shortcode to wpgb-content-1
• Add the shortcode on your page with the Query Loop
• Add and enable the code snippet below:

Code Snippet:

add_filter( 'generateblocks_query_loop_args', function( $query_args, $attributes ) {
		if ( ! is_admin() && ! empty( $attributes['className'] ) && strpos( $attributes['className'], 'wpgb-query' ) !== false ) {
			$query_args['wp_grid_builder'] = 'wpgb-content-1';
		}

		return $query_args;
	}, 10, 2 );

Get WP Grid Builder: https://jonathanjernigan.com/go/wpgb

Code was sourced from GenerateBlocks forums here: https://generatepress.com/forums/topic/how-to-set-up-a-custom-parameter/#post-2302691

Learn about my Generate Made Easy course: https://jonathanjernigan.com/generate-made-easy/