How to Display Results On a Separate Page
We often get asked how to show filters on one page (like the homepage) that redirect to a separate results page.
Background
In order for facets to appear, there needs to be a template on the page so that FacetWP knows which choices to display.
Setup
First, install and activate the (free) Submit add-on.
Next, browse to Settings > FacetWP and add a new template. Click on the “Query” tab (you can ignore the “Display” tab).
Here we’ll tell FacetWP which post type(s) to pull content from. Try to get the query to match as closely as possible to that of the results page you’re wanting to redirect to.
Filters page
Let’s say you’ve named your FacetWP template listing
, the results page is located at /listings/
, and you have facets named location
and categories
.
Edit the appropriate template file (homepage.php?) and add the following to output your template, facet, and submit button:
<?php echo facetwp_display( 'facet', 'location' ); ?> <?php echo facetwp_display( 'facet', 'categories' ); ?> <div style="display:none"><?php echo facetwp_display( 'template', 'listing' ); ?></div> <button class="fwp-submit" data-href="/listings/">Submit</button>
Or you could use shortcodes instead (if using the WYSIWYG, Gutenberg, or a page builder plugin):
[facetwp facet="location"] [facetwp facet="categories"] <div style="display:none">[facetwp template="listing"]</div> <button class="fwp-submit" data-href="/listings/">Submit</button>
data-href
attribute.Results page
If your /listings/
page is an archive, then all you’ll need to do is add your facet shortcodes somewhere on the page (e.g. in the sidebar).
If it’s a standard page, you could just drop in the listing
template shortcode that we created earlier, along with the facet shortcodes.