Use FacetWP alongside Beaver Builder and (optionally) Beaver Themer.

Supported modules

  1. Posts
  2. WooCommerce
  3. Advanced Posts (requires the UABB plugin)
  4. Woo Products (requires the UABB plugin) NEW!
  5. Content Grid (requires the PowerPack plugin)
  6. Product Grid (requires WooPack)

Usage

FacetWP and supported modules for Beaver Builder

If you’re using a supported listing module (see above), you’ll see a new “FacetWP” setting on the module’s edit screen.

Set it to “Enabled” for FacetWP to use the listing for filtering.

Next, add some facets to the page. When editing the page via Beaver Builder’s visual mode, click the blue “+” to display available modules. Within that area, you’ll see a new “FacetWP” section.

Select the “Facet” option, then choose an existing facet:

Other FacetWP features (Sort, Selections, etc.) are available as modules too.

Pagination

In most cases, FacetWP will automatically detect Beaver Builder’s numbered pagination. However, you can optionally set the module’s pagination to “None” and use a Pager facet instead.

Archive pages

Beaver Themer allows you to design layouts for Archive pages (blog posts archive, taxonomy archives, etc).

You will need to set the Content > Source in your posts module for the archive to Main Query. This ensures the WordPress archive query is used for both Beaver Builder and FacetWP.

Customizing a Posts module query

If you need to adapt or override the query of a Posts module, you can use Beaver Builder’s fl_builder_loop_query_args hook. For example if you want to display only specific custom post types, change the order, or use a meta query.

This hook works similar to WP’s pre_get_posts hook. It exposes the WP_Query object and allows you to customize the query in any way you want.

The following example adds a fallback sorting method by overriding the original orderby query argument, on the front page only:

function my_query_order( $query_args ) {
  if ( is_front_page() ) {
    $query_args['orderby'] = array(
      'date'  => 'DESC', // Primary sort: by post date
      'title' => 'ASC'   // Secondary, fallback sort: by post title
    );
  }
  return $query_args;
}
add_filter( 'fl_builder_loop_query_args', 'my_query_order' );

For more examples of how to use this hook, including how to apply it only to a specific module, see this Beaver Builder tutorial.

For an overview of all available Beaver Builder hooks, see this page.

Changelog

1.4

  • Fixed JS updated to support FacetWP 3.9
  • Fixed removed BB's "offset" setting when FacetWP is enabled for the current grid

1.3.3

  • Fixed issue with the WooCommerce module
  • Fixed issue with query detection and pagination when using a Themer layout

1.3.2

  • New added support for the UABB "Woo Products" module
  • New support equal heights for "Posts" module
  • Fixed ignore the main archive query if a Beaver Themer archive layout exists
  • Fixed only intercept pagination for FWP-enabled modules

See also