Filter Archive Queries

Introduction#Introduction

WP Grid Builder offers the possibility to filter results from archive pages without the need to use a grid made with the plugin. This means that you can use facets in your archive pages to filter results.

If you are using Elementor, Oxygen, Beaver Builder or Bricks plugin, you should use the corresponding WP Grid Builder add-ons instead of using the following method.

Depending on the theme or site builder you use, it may not work or create conflicts, especially if the results are layout with JavaScript.

Principle#Principle

By default, this feature is disabled. To make it work, you need to enable the option Filter Custom Content in the plugin settings panel.

Once this option is activated, WP Grid Builder will try to detect the main query of the page and will inject a hidden element (at the beginning of the loop), used to filter the results.

In order to filter the archive page results, you also need to set wpgb-content as grid name in the facet block or use shortcode as follows: [wpgb_facet id="1234" grid="wpgb-content"]

Limitations#Limitations

Some themes use a custom query instead of the main query generated by WordPress. In this case it will not work because WP Grid Builder will not be able to detect the main query from archive pages.

In most cases, the pagination of the archives will be in conflict with the facets. To avoid conflicts, you should use the pagination facet instead of the pagination of the archive pages.
You can use the following snippet to remove pagination from the archive pages:

function remove_archive_pagination( $query ) {

	if ( is_archive() ) {
		$query->set( 'no_found_rows', true );
	}
}

add_action( 'pre_get_posts', 'remove_archive_pagination' );

To remove the pagination from WooCommerce you can use theses snippets:

remove_action( 'woocommerce_before_shop_loop', 'woocommerce_pagination' );
remove_action( 'woocommerce_after_shop_loop', 'woocommerce_pagination' );

When using WooCommerce you may also need to remove catalog ordering and result count:

remove_action( 'woocommerce_before_shop_loop', 'woocommerce_catalog_ordering', 30 );
remove_action( 'woocommerce_before_shop_loop', 'woocommerce_result_count', 20 );

These snippets may not work with all themes and archive pages.
Theme authors should be able to provide such snippets in order to remove paginations.

WooCommerce Example#WooCommerce Example

If you need to filter shop page results of WooCommerce you simply need to edit the Shop page and to insert facet shortcodes as follows:

To remove paginations, result count and catalog ordering from Storefront theme, you can use this snippet to add in functions.php file of your child theme:

remove_action( 'woocommerce_before_shop_loop', 'storefront_woocommerce_pagination', 30 );
remove_action( 'woocommerce_after_shop_loop', 'woocommerce_pagination', 30 );
remove_action( 'woocommerce_before_shop_loop', 'woocommerce_catalog_ordering' );
remove_action( 'woocommerce_after_shop_loop', 'woocommerce_catalog_ordering' );
remove_action( 'woocommerce_before_shop_loop', 'woocommerce_result_count', 20 );
remove_action( 'woocommerce_after_shop_loop', 'woocommerce_result_count', 20 );