Show All Posts On 1 Page In Grid With Equal Height

Aug 26, 2017

—

The template in this tutorial enables you to display all tag archives on 1 page like you see in the below screenshot.

The template displays the tag archive heading, description and lists tagged posts under each tag name like this :

Each entry will display exactly the same height & width regardless of how much content is shown and regardless of the difference in length of entry title.

Demo

Check out the live demo.

Template Functionality

The template is coded with the following default functionality :

Display the tag name & description otherwise displays the archive headline and intro text if added.
Uses the post_tag taxonomy however can be used with any other taxonomy including custom taxonomy types of custom post types.
Display unlimited number of posts for each tag however this can be set to any number.
Featured image is not included by default however it can be added.
Displays in 3 columns using equal height for each entry however can display in any number of columns and can also be displayed in uneven columns with equal or unequal height.
Displays in 2 columns @ 1200px & 1 column @ 960px width.

Template Installation

There’s 2 simple steps :

Step 1 : From the download folder, upload the file named posts-by-tag.php to your child themes root directory and select the template named All Tagged Posts from the Templates drop down menu in the page attributes meta box located on any Edit Page admin screen.

Step 2 : From the download folder, copy & paste the CSS to the end of your child themes style.css file and clear caching.

Here’s the download folder for logged in users :

Related Templates

CSS Grid Columns Taxonomy Terms

Comments

2 responses to “Show All Posts On 1 Page In Grid With Equal Height”

Isaac Linder

November 13, 2017

Hi Brad,

This is fantastic. Thanks! I have quick question that would help me to augment this all over the site. Is there a way to control the order of the outer taxonomy loop? I’ve organized our products (which are in a CPT) with a ‘Service Line’ custom taxonomy. However, what I need to try and do is organize the taxonomy ‘chunks’ (the headline, description and grid for that tax) in a custom way. I’m not sure of the default order of the taxonomy, but assume it is currently by ID. Often I would brute force this by just changing the publish date and order by date. But taxonomies don’t have this. I was curious how you may approach this (not necessarily via tutorial, but just ideas).

It seems like this must be somewhat common – I just haven’t gotten as deep in type of logical structuring, organization and display until this point.

Thanks,
Isaac

Log in to Reply
1. Isaac Linder
  
  November 13, 2017
  
  Hey again,
  
  Nevermind that question. I found the NSP Code “Category Order and Taxonomy Terms Order” which does the trick globally!
  
  Thanks,
  Isaac
  
  Log in to Reply

Join 5000+ Followers

Get The Latest Free & Premium Tutorials Delivered The Second They’re Published.