Gists

<?php 
// Pre-select the first facet choice when this choice is unknown / different on each page the facet is placed on
// To pre-select a know choice, use the 'facetwp_preload_url_vars' hook instead:
// https://facetwp.com/help-center/developers/hooks/querying-hooks/facetwp_preload_url_vars/

add_action( 'facetwp_scripts', function() {
  ?>
  <script>
    document.addEventListener('facetwp-refresh', function() {
      if ( !FWP.loaded ) { // Only on first page load
        var facet_name = 'my_facet_name';  // Change 'my_facet_name' to the name of your facet
        if ( 'object' == typeof FWP.facets[facet_name] && 1 > FWP.facets[facet_name].length ) {
          var temp = document.createElement('div');
          temp.innerHTML = FWP_JSON.preload_data.facets[facet_name];
          var first = temp.getElementsByClassName('facetwp-radio'); // for a Radio facet, change if needed
          first = first[1]; // Pre-select the second choice, skips the first "Any" choice. Use first[0] if there is no "Any" choice
          FWP.facets[facet_name] = [ first.getAttribute('data-value') ];
          FWP.loaded = 1; // force TRUE to make an AJAX request & populate results
        }
      }
    });
  </script>
  <?php
}, 100 );


// Alternative: Pre-select using a page refresh with window.location.href instead of facet refresh

add_action( 'facetwp_scripts', function() {
    ?>
      <script>
        document.addEventListener('facetwp-refresh', function() {
            if ( !FWP.loaded ) {
                var facet_name = 'my_facet_name';  // Change 'my_facet_name' to the name of your facet
                if ( 'object' == typeof FWP.facets[facet_name] && 1 > FWP.facets[facet_name].length ) {
                    var temp = document.createElement('div');
                    temp.innerHTML = FWP_JSON.preload_data.facets[facet_name];
                    var first = temp.getElementsByClassName('facetwp-radio'); // for a Radio facet, change if needed
                    first = first[1]; // Pre-select the second choice, skips the first "Any" choice. Use first[0] if there is no "Any" choice
                    FWP.facets[facet_name] = [ first.getAttribute('data-value') ];
                    let qs = FWP.buildQueryString();
                    let href = window.location.href
                    let prefix = (-1 < href.indexOf('?')) ? '&' : '?';
                    window.location.href = href + prefix + qs;
                }
            }
        });
      </script>
    <?php
}, 100 );

<?php
/**
 ** hide a reset button header in mobile facet when no facets are selected
 ** auto-hide option does not yet work for mobile header
 **/

add_action( 'wp_head', function() {
    ?>
    <script>
    (function($) {
        $(document).on('facetwp-loaded', function() {
            if ('' != FWP.buildQueryString()) {
                $('.flyout-row.name-my_reset').show(); // change my_reset to name/slug of your reset facet
            } else {
                $('.flyout-row.name-m_-reset').hide(); // change my_reset to name/slug of your reset facet
            }
            });
    })(jQuery);
    </script>
    <?php
}, 100 );

<?php
/** adds script to header 
 **/
add_action( 'wp_head', function() { ?>
	<script>
		(function($) {
        $(document).on('facetwp-refresh', function() {
            if (FWP.loaded && 'recipes' != FWP_HTTP.uri) { // if not the initial pageload, and we're on the homepage
                window.location.href = '/recipes/?' + FWP.buildQueryString(); // redirect
            }
        });
    })(jQuery);
	</script>
<?php } );

add_action( 'wp_head', function() {
?>
<script>
(function($) {
	$(document).on('facetwp-loaded', function() {
		if ('' != FWP.buildQueryString()) {
			$('.facetwp-template').show();
		} else {
			$('.facetwp-template').hide();
		}
	 });
})(jQuery);
</script>
<?php
}, 100 );

<script>

(function($) {
  $(document).on('facetwp-loaded', function() {
    var in_use = ('' != FWP.buildQueryString());
    $('.your-reset-btn').toggleClass('hidden', ! in_use);
  });
})(jQuery);

</script>

<style>
/* add to your stylesheet */
.hidden { display: none; }
</style>

<?php
/** update check for facets in url for use with direct links with vars in url
 ** https://facetwp.com/how-to-hide-the-template-until-facets-are-selected/
 **/
add_action( 'wp_head', function() { ?>
    <script>
        (function($) {
            $(document).on('facetwp-loaded', function() {
                if (FWP.loaded ||  '' != FWP.buildQueryString()) {
                    $('.facetwp-template').addClass('visible');
                }
            });
        })(jQuery);
    </script>
<?php }, 10, 2 );

<script>

/*
Code placement: see the "Javascript" section on https://facetwp.com/how-to-use-hooks/
This assumes that your reset button looks like this:

<a class="my-reset-btn" onclick="FWP.reset()">RESET</a>
*/

(function($) {
    $(document).on('facetwp-loaded', function() {
        var qs = FWP.buildQueryString();
        if ( '' === qs ) { // no facets are selected
            $('.your-reset-btn').hide();
        }
        else {
            $('.your-reset-btn').show();
        }
    });
})(jQuery);

</script>

<?php

// Add to your (child) theme's functions.php

add_action( 'wp_head', function() {
?>
    <script>
        (function($) {
            $(document).on('facetwp-loaded', function() {
                var facets_in_use = ('' != FWP.buildQueryString());

                // see https://api.jquery.com/toggle/
                // TRUE to show, FALSE to hide
                $('.btn-reset').toggle(facets_in_use);
            });
        })(jQuery);
    </script>
<?php
}, 100 );

(function($) {
    $(document).on('facetwp-refresh', function() {
        if ( 'fr/accueil' == FWP_HTTP.uri && 'undefined' !== typeof FWP.facets['categories'] && FWP.facets['categories'].length > 0  ) {
            var query = FWP.buildQueryString();
            window.location.href = '/search-results/?' + query;
        }
    });
})(jQuery);

(function($) {
	$(document).on('change', '.facetwp-facet-product_tags', function() { // change product_tags to name of dropdown facet
		FWP.parse_facets();
		FWP.set_hash();
		var query = FWP.buildQueryString();
		window.location.href = '/search-results/?' + query; // search-results to correct page
	});
})(jQuery);