Overview

With this hook, you can control which JavaScript or CSS files are rendered.

Note that FacetWP intentionally does not use WP enqueue or dequeue functions. Assets are only loaded when facets are detected on the page, which cannot be done using wp_enqueue_script() or wp_enqueue_style().

Parameters

  • $assets | array | An associative array of assets to load

Usage

Add a custom JavaScript file to facet pages:

add_filter( 'facetwp_assets', function( $assets ) {
    $assets['custom.js'] = 'URL/TO/YOUR/custom.js';
    return $assets;
});

To remove an existing asset, you can use the following code. For all available asset keys, see the overview below.

add_filter( 'facetwp_assets', function( $assets ) {
    unset( $assets['event-manager.js'] );
    return $assets;
});

Include the script for improved facet accessibility:

add_filter( 'facetwp_assets', function( $assets ) {
    $assets['accessibility.js'] = FACETWP_URL . '/assets/js/src/accessibility.js';
    return $assets;
});

Remove FacetWP’s CSS styles

If you want to remove FacetWP’s front-end CSS styles entirely, for example to style your facets entirely from scratch, you can remove front.css like this:

add_filter( 'facetwp_assets', function( $assets ) {
    unset( $assets['front.css'] );
    return $assets;
});

Alternatively, you can use the following filter:

add_filter( 'facetwp_load_css', '__return_false' );

Available asset keys

  • event-manager.js
  • front.css
  • front.js
  • front-facets.js
  • jquery.autocomplete.css
  • jquery.autocomplete.js
  • flatpickr.css
  • flatpickr.js
  • fSelect.css
  • fSelect.js
  • gmaps
  • nouislider.css
  • nouislider.js
  • nummy.js
  • edd.js
  • query-string.js
  • woocommerce.js

More examples

See also