Updated on May 26, 2017 In the past, I wrote about setting up Grid of Portfolio images with Title and Excerpt on Hover in Showcase Pro on the portfolio CPT archive page. In this tutorial we shall replace a Showcase Pro's front page widget area (Front Page 4 to be specific) with a manual WP Query to pull the latest 6 portfolio CPT entries and write CSS to reveal the title and excerpt when the featured image is hovered for each entry. We will set the entries to appear in 3 columns on desktop widths, in 2 columns for screen widths <= 736px and in 1 column for screen widths <= 500px using :nth-of-type pseudo-class selector. Screencast:
Tested in Showcase Pro 2.0.0
Step 1Install and activate Portfolio Post Type plugin. Add Portfolio items and upload/select featured images. In my test site, I have used images that are 800 x 600.
Step 2In functions.php replace
genesis_register_sidebar( array( 'id' => 'front-page-4', 'name' => __( 'Front Page 4', 'showcase' ), 'description' => __( 'This is the 4th section on the front page.', 'showcase' ), ) );
To view the full content, please sign up for the membership.
Already a member? Log in below or here.