Genesis Tutorials

Filterable Portfolio in Genesis

The code in this tutorial enables you to filter all items in your custom post type and all existing and future items added to your CPT custom taxonomy types.

Here’s a example showing how the filters look on both the portfolio archive & taxonomy pages :

The major benefits of using this solution are as follows :

  1. Consistent clean coding – Hand coded by me. I’m not using Google to find bits & pieces of code on other peoples sites!
  2. Simple template installation – Upload 2 files to your child themes root directory to add the templates
  3. Dynamic – Filters are dynamically added to new taxonomy archive pages when new custom taxonomy types are created so no need to modify/add code.
  4. Working pagination – Pagination works on all CPT & custom taxonomy types as well as all filtered pages which use pagination.
  5. Works in any theme – Should not require any code modification for use in most genesis child themes. May need some small CSS tweaks for use in some themes.

Here’s the demo video video showing how easy it is to filters items.

Video Demo

The video shows how the checkboxes for filtering items by taxonomy are added to both the portfolio and taxonomy archive pages. The pagination is also tested and works.

Tested using the Magazine Pro child theme by StudioPress.

Code Installation

There’s 4 simple steps:

Step 1 : Upload the archive-portfolio.php & taxonomy-portfolio-type.php files to your child theme folder.

Step 2 : Add the CSS from the style.css file to the end of your child themes style.css file, before the start of the CSS for Media Queries, and clear caching.

Related Tutorials

Leave a Reply

Your email address will not be published. Required fields are marked *