Displaying Posts output by Display Posts Shortcode in Masonry style
read more
Categories

Displaying Posts output by Display Posts Shortcode in Masonry style


On a site that I have recently taken over, the client tried using Essential Grid for displaying groups of Posts (each tagged with a specific term) in Masonry style. But due to some conflict with Optin Monster, only the loader was appearing for non-logged in visitors – not the Posts themselves.

In this article I share how I re-created the same using Masonry which is included in WordPress out of the box.

Here are the design goals:

It should be as easy as using a shortcode for showing each group of tagged Posts.
Only those Posts that have Featured images should be pulled.
It should be possible to use multiple shortcodes on a Post/Page.
Post blocks should fill the available width of the container. (I have set this to be met at regular desktop width, 1024px, 768px, 568px, 480px and 320px)
Author name should be displayed. “by” before the author name should not be present.
Links should open in new windows/tabs.

Here’s how I set it up: