Designing the lists of posts (blog, archives, search) in the Customizr theme

The are several types of context in which your WordPress website will display a list of posts :

  • Home page : if you've decided to display your blog posts on home
  • Blog page : if you've decided to display your blog posts on a specific page
  • Archive's pages : page displaying posts of a particular category, tag, author, date
  • Search results

In most of the cases, WordPress sites display their posts listed one after the other for ease of browsing for the reader. With the Customizr theme, there are always more ways of doing things and so it is with post lists designs.

The Customizr theme has many built-in options for changing the appearance of the post lists. So, let us explore the options that you have. Here we go!

Accessing the Post lists settings

From the WordPress customizer, go to Content > Post Lists to access the post list design.

There are five sections under this.

- Global Post List Settings -

The global settings for the post lists are under this section. There are three settings:

  • Maximum number of posts per page - Specify the number of posts that you want to display in your post lists. If you specify a very high number, and the total number of posts published is lesser, all the posts are displayed. If this number is lesser than the total number of posts published, then after listing out the posts, an Older Posts button is displayed for ease of navigation.
  • Select the length of posts in lists (home, search, archives, ...) - This setting is used to choose whether you want to display an excerpt only or the entire content of the post.
  • Set the excerpt length - Give the length of the excerpt, in number of words. The default is 50.

- Post List Design -

  • This section gives us the option to select a layout between the two - the grid layout or the alternate thumbnails layout. If you choose the Grid Layout, you get further options to customize it which are explained in detail here.

  • If you choose the Alternate Thumbnails Layout, then it can be customized further in the following sections.

- Thumbnails options -

  • Under this section, you can first choose whether you want post thumbnails to be displayed or not by checking against Display the post thumbnails. For the Grid Layout, post thumbnails are displayed by default. But, for the Alternate Thumbnails layout, you can disable this option so that the post lists do not have any thumbnails.
  • By default, If no featured image is set, use the last image attached to this post is checked. If you want posts without featured images not to have thumbnails, disable this setting.

Related WordPress Resources :

How to set a featured image to blog post or a page ?

- Thumbnails options for the Alternate Thumbnails Layout -

  • For the Alternate Thumbnails Layout, there are more settings under this section.

Thumbnails shape

  • Firstly, choose the Thumbnails shape. You can choose one amongst the seven options listed below. The choices are self-explanatory. Look at the preview to decide what you like and what blends with your site.
    • Rounded, expand on hover
    • Rounded, no expansion
    • Regular

Thumbnails position

  • The next option is the Thumbnails position. Choose from Right and Left.
  • When you choose Left or Right, the content is placed next to the thumbnail. Look at the demo site below.

Alternate thumbnail/content

  • The third setting is the Alternate thumbnail/content. You can check this to enable alternation. 

- Archive titles -

  • This last section gives the choice of titles for your post lists. You can change the titles for the Category Pages, Tag Pages, Author Pages and Search Results Page in the four input boxes provided.

Take a look at this post list created in a demo installation. This is an example of an Alternate Thumbnails Layout, with Thumbnails position set as Right.

Do try out various combinations of the options and settings and arrive at that perfect setting that gives the best appearance for your site. Make your site inviting for your readers with the help of Customizr.

Doc created by: Menaka S.