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>

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.