This tutorial provides the steps to display featured images of entries (posts) on archive pages in Genesis in a 3-column grid using CSS Grid with Flexbox fallback (for oldIE). For entries that do not have a featured image set, the first attached image will be shown and if that's not present, a fallback image. The number of columns will be set to change from 3 to 2 to 1 as the screen width is reduced. The image will be linking to the corresponding permalink. Archives = Category archives, tag archives, author archives, CPT archives, date archives, taxonomy archives etc. provided a more specific template is not present that will override
While the tutorial has been written for Genesis Sample, it should work with a few adjustments in any Genesis theme.
Step 1Register a custom image size for the images to be shown in the grid archives. Add the following in child theme's functions.php:
add_image_size( 'category-image', 600, 350, true );
Step 2Create a file named archive.php in the child theme directory having the following:
To view the full content, please sign up for the membership.
Already a member? Log in below or here.