Display WP Posts in a Visual Grid Layout

How to Display WP posts in a Visual Grid Layout

gridlayout for wp posts

WordPress posts in a visual Grid Layout



What I want to do, especially over at my ClearlyHelena.com website, is to be able to (automatically) display all my posts (within a category) in a visual grid layout.

The visual grid layout makes finding articles (posts) much easier.  At the moment, WP (Word Press) does not provide an automatic grid layout for posts and pages.

This article How To: Display Your WordPress Posts & Pages in a Grid Layout was very useful in helping me find a possible plugin for WordPress.  The article provides a number of possible (paid as well as free) plugins that would do just what I wanted – display posts into a grid layout.  Automatically if possible.


Content Views WP Plugin

content views plugin 01

WP Content Views plugin, as of Jan 2017

I am choosing Content Views plugin as the first plugin to try. I will let you know how it goes later.

Content Views plugin is free. At this time of writing, it seems very popular. Has over 50K+ active installs. And a high user rating.
Below is an excerpt from the Word Press plugin site.

Content Views helps you to display latest posts on any page, and more:

  • display posts by category, tag, author, ID, keyword, status
  • display pages by author, ID, keyword, status
  • display children of a parent page
  • sort posts by title, date, ID
  • display any post data: featured image, title, full content or excerpt, meta fields (date, author, category, tag, comment count)
  • display featured image in any size (thumbnail, medium, large, full…)
  • limit number of posts to display
  • enable/disable pagination (ajax, non-ajax)
  • custom actions, filters hook for developers

How to use Content Views plugin

Here is a video by the the plugin’s author, PT Guy.

You might also want to refer to additional documentation on how to use Content Views.

Basically, you create the Content View layout you want.  This will generate a shortcode that you can then copy into a page or post which you can then publish (make viewable to user).


Summary: How to Use Content Views plugin in WordPress

  1. go to Admin dashboard >> Content Views >> Add new
  2. give your new Content Views layout a Title. Tweak filters (i.e. which posts or categories, etc. to include) and settings (how many posts per page, how many per row, etc.)
  3. preview the layout. Save.  You will be generating a shortcode.  Copy the shortcode
    content views plugin 02a
  4. Create a new WP page.  Name it. Paste in the shortcode. Save page.
  5. Go to your site’s navigation menus (Appearance >> Menus) and add the new page to the Menus.

I know this is very brief. But I have decided to prioritise brief-but-short over long-but-backlogged! However I hope there is enough details to get you going.

Feedback on WP Content Views plugin

Well I have tried one new  Content Views layout so far. And it worked brilliantly. (You can have a quick look at my new grid layout for my existing category: “Beading Tips and Techniques“) over at ClearlyHelena.com.

It worked better than I expected. It has many more features and options than I expected.  It was quite easy to use.  Now I have to go ta-ta coz I have a lot of work to do to change much of my WordPress posts into a visual grid layout, by category.

Note: you don’t need to display your posts or pages in grid layout, by category.  The plugin allows you to select by particular posts/pages or by some other filter.

Addendum: one day later …

Re. Free Content Views plugin

I was using the free version of Content Views plugin (v1.9.3.2).

In the free version, you can see number of images/thumbnails per row, as well as the size of the image/thumbnails.  As far as I can determine, the number of images/row will take precedence over the size.

For example, if you set 5 images per row, and choose the thumbnail size to be (1024×1024), you will get 5 images but they will not display images in (1024×1024) size. I think the thumbnail images default back to 300×300. So that 5 images can actually fit into a row (?)

As for their Pro Version, I had a look at it as well.  Pro version offers much better looking layouts and more flexible customisation.  So I decided to give it a try.


Content Views Pro v4.2.1 (Paid Version)

Content Views Pro is the paid version.  I got the single site license.  Their license is only valid for 1 year. (See: https://www.contentviewspro.com/pricing/?utm_source=docs)

Apparently you can continue using the plugin after the license has expired.  However to get support or access to upgrades, you have to renew the license.  (Not ideal.  But for now, I will just see how it goes for this year. I purchased the Content Views Pro license for ClearlyHelena.com).

Installing Content Views Pro

After you have paid for your license, you will be given some screen info as well as the same info via an email.

That info will contain:

  • license key
  • link to documentation (on how to install, use, etc.) (http://docs.contentviewspro.com/)
  • user name and password to their forum

Enter you License Key

After installing and activating Content Views Pro, go to your WP admin dashboard >> Content Views >> Settings >> (enter license key on that page)

content views pro license

Content Views Pro plugin (paid) for WP – License key

Fingers crossed that this Content Views Pro plugin will work smoothly. Off I go to experiment … ta ta!

Enjoyed this post?

Easily subscribe to keep get all new postings via email. No We Don't Serve Spam - Ever!

We respect your privacy

Your Comments? Tips to share?