Using FacetWP

See this in action on Pinch of Yum.

First you define a template. Here’s the listing of all templates:

The single template contains the main query arguments and the display code. I like to use my own function which I define in the theme, ea_post_summary():

Then you set up the facets, which are the filtering criteria. Here’s a list of all the facets:

And the options on a specific facet:

Finally, the template file I use to display it all. I created a page called Recipes and selected the “Recipes” page template, which uses this code:

* EA Genesis Child.
* @package EAGenesisChild
* @since 1.0.0
* @copyright Copyright (c) 2014, Contributors to EA Genesis Child project
* @license GPL-2.0+
/* Template Name: Recipe Listing */
* Recipe Listing
function ea_recipe_listing() {
echo facetwp_display( 'template', 'recipes' );
echo facetwp_display( 'pager' );
add_action( 'genesis_loop', 'ea_recipe_listing' );
remove_action( 'genesis_loop', 'genesis_do_loop' );
* Recipe Listing Sidebar
function ea_recipe_listing_sidebar() {
remove_action( 'genesis_sidebar', 'genesis_do_sidebar' );
if( function_exists( 'ss_do_sidebar' ) )
remove_action( 'genesis_sidebar', 'ss_do_sidebar' );
echo '<h5>Healthy</h5>';
echo facetwp_display( 'facet', 'healthy' );
echo '<h5>Breakfast</h5>';
echo facetwp_display( 'facet', 'breakfast' );
echo '<h5>Lunch</h5>';
echo facetwp_display( 'facet', 'lunch' );
echo '<h5>Dinner</h5>';
echo facetwp_display( 'facet', 'dinner' );
echo '<h5>Dessert</h5>';
echo facetwp_display( 'facet', 'dessert' );
add_action( 'genesis_sidebar', 'ea_recipe_listing_sidebar', 5 );
view raw recipe-listing.php hosted with ❤ by GitHub

Bill Erickson

Bill Erickson is a freelance WordPress developer and a contributing developer to the Genesis framework. For the past 14 years he has worked with attorneys, publishers, corporations, and non-profits, building custom websites tailored to their needs and goals.

Ready to upgrade your website?

I build custom WordPress websites that look great and are easy to manage.

Let's Talk