How to hide the template until facets are selected
To hide the template on pageload, add the following CSS to your theme’s style.css
:
.facetwp-template { display: none; }
.facetwp-template.visible { display: block; }
Then, add the following into your theme’s functions.php
or into the Custom Hooks plugin:
add_action( 'wp_head', function() {
?>
<script>
(function($) {
$(document).on('facetwp-loaded', function() {
if (FWP.loaded) {
$('.facetwp-template').addClass('visible');
}
});
})(jQuery);
</script>
<?php
}, 100 );
That’s it! Now your template is hidden until the facets get used.