A user asked,
I'm trying to add a column grid of the 8 latest portfolio items to my front page (amongst other content) by adding code tin front-page.php. Each item should show the featured image, title and excerpt. I need to keep the standard loop in tact to display the introductory content but just add the portfolio items as additional content.
In this video tutorial I show how we can display 8 entries of a Portfolio CPT next to each other in columns below the header. We are going to use Genesis Sandbox Featured Content Widget plugin for outputting the entries in a custom Home Featured widget area that's hooked to genesis_after_header in front-page.php.
In CSS each entry is floated left and given a left margin equal to the desired gap between the entries. :nth-of-type pseudo-class is used to remove the left margin for entries in first column for all rows.
We shall also write media queries such that the number of columns changes depending on the viewport width for responsiveness like this:
769px and above: 8 columns
Between 501px and 768px: 4 columns
500px and below: 2 columns
Screenshot:
Screencast:
Excellent, thanks Sridhar.
Can this also be done using wp_query to create a second loop then applying column classes to that loop? I have written a loop and but cannot apply Genesis column classes to it, and I would like to be able to use your method above, and this, in different situations.
have_posts() ) :
while ( $projects->have_posts() ) : $projects->the_post(); ?>
<a href="” title=””>
Can you paste the code at http://www.pastebin.com and give the link?
Hi Sridhar,
http://pastebin.com/w75ntNA3
I just need to apply Genesis column classes to this.
Thanks!
Hi Sridhar, just wondered if you had managed to look at the code in Pastebin before it expired? Or shall I re-post it?
Thanks!