Skip to content
This repository has been archived by the owner on Jun 14, 2022. It is now read-only.

Post Grid Block

Jump to bottom
Mike McAlister edited this page May 6, 2019 · 4 revisions

Getting started with the Post Grid block

The Post Grid block gives you an advanced, customizable, sortable grid of posts and pages for your site. The Post Grid comes with settings to toggle on and off images and content, as well as settings to change the markup to match your content.

Adjusting Post Grid block settings

The Post Grid block comes with several handy settings to help you quickly customize the posts and pages to match your site's content.

Post and Page Grid Settings

  • Content Type - Toggle between showing posts or pages in the post grid.
  • Order By - Display your posts in ascending or descending order based on publish date or by post name.
  • Category - Show posts from a particular category. Only available for posts.
  • Number of Items - Select the number of posts you'd like to show on the post grid.
  • Number of Items to Offset - Select the number of posts you'd like to skip from the beginning of the post list.
  • Columns - Select the number of columns (between 1 and 4) to display your posts in.
  • Content Type - Toggle between showing posts or pages in the post grid.

Post and Page Grid Content

  • Content Toggles - Use the toggles to enable or disable the output of the section title, featured image, post title, author, date, excerpt, and continue reading link.

Post and Page Grid Markup

  • Post Grid Section Tag - This dropdown selector allows you to choose the HTML tag for the wrapper around the post grid to help you match your content hierarchy.

  • Post Title Heading Tag - Change the heading tag on the post title to match your content hierarchy.

Featured Image Sizes

The Post Grid block comes with settings to adjust the size of the featured image displayed in the post grid. The block will detect image sizes defined by the theme, as well as the standard thumbnail, medium, large, and full size image sizes provided by WordPress. The block also provides a AB Grid Square and AB Grid Landscape sizes that are designed to fit the grid's design.

By default, the post grid will load the full size image, since this image will always be available. However, it is advised that you select an image size that suits your content accordingly.

There will be instances where there isn't an image available for the image size that you select (indicated by a little yellow icon on the image). This could be that the featured image for that post is smaller than the size you selected, or that the image simply doesn’t have that size generated yet. This can happen if your image was uploaded before the image size was defined a theme or plugin.

The easiest way to fix this is by regenerating your image sizes by installing the Regenerate Thumbnails plugin. Once installed, go to Tools > Regenerate Thumbnails to run the plugin. This plugin will go through your media library and regenerate the missing image sizes. Once you've refreshed your images, you should have images available for all the image sizes in the post grid image size settings.

Clone this wiki locally