In my tutorial requests Trello board a user requested for a tutorial on displaying Portfolio Custom Post Type entries in Masonry style. In this article we shall
- use Portfolio Post Type plugin for setting up portfolio in Genesis
- create a custom template for the portfolio CPT archive page
- add the necessary CSS
Step 1Install and activate Portfolio Post Type plugin. Add your portfolio entries along with their corresponding images. Ensure that the width of images is at least 500px. Height can be any and ideally should vary or otherwise the masonry effect may not be apparent.
Step 2Add the following in child theme's functions.php:
// Register a custom image size for image thumbs on Portfolio CPT Archive add_image_size( 'portfolio-archive-thumb', 500, 0, true );
Step 3Create a file named archive-portfolio.php in the child theme directory having the following code:
To view the full content, please sign up for the membership.
Already a member? Log in below or here.