Theme version of this tutorial can be purchased from here.
All the posts of the
portfolio custom post type (CPT) will be set to appear on the CPT's archive in a Masonry grid with a portfolio category filters row.
Clicking on any filter button will narrow down the entries to only those that belong to that custom taxonomy (
Entries will appear in a single column up to 599px, in 2 columns between 600px and 959px, and in 3 columns from 960px and above.
A placeholder image will be shown for items not having featured images.
The solution is modular - meaning, it can easily be reused on other index views like the Posts page and category archives with a few changes to the code.
While the tutorial has been written for Genesis Sample 2.6.0, it should work with a few adjustments in any Genesis theme.
Create Portfolio Custom Post Type using a plugin like Portfolio Post Type.
This plugin automatically creates the
portfolio CPT and the
portfolio_category taxonomy used in the demo site.
Add Portfolio items and set their featured images. 600px is the ideal width. For the best masonry look, use images of varying heights.
Assign the portfolio entries to
portfolio_category custom taxonomy.
Add the following in child theme's functions.php:
To view the full content, please sign up for the membership.
Already a member? Log in below or here.