1. Home
  2. Knowledge Base
  3. Thrive Architect
  4. Thrive Architect Elements
  5. Using the Post List Element in Thrive Architect

Using the Post List Element in Thrive Architect

Do you want to display your website blog posts, pages, custom post types, and Thrive Apprentice content (in case you’ve created courses) in a well-arranged layout on a page? This is possible using the Post List Element of Thrive Architect.

In this article, we’ll show you how to add the Post List element to a post and customize it to your needs.

Adding the Post List Element to a Post

To see the Post List element in action, we recommend you set up the page you want to include it in and click the + (plus) icon in the left column.

After you click the plus icon, start typing “post list” in the search bar to find the Post List element appears in the menu.

When you see the Post List element, drag and drop it on the page. A popup will appear, and you can select a template with the layout you want to show your posts.

After selecting a template, it fetches the blog posts on your website and displays them in your chosen layout.

Note: To see the Post List element in action, you must ensure at least two blog posts are published on your website.

Styling the Post List Element

After you see the posts added in the selected Post List template, styling options appear in the left column.

This is where you can edit almost everything about the Post List you’ve included on the page.

Changing the Post List Template

When you click on the arrow besides the template name in the left column, a popup will appear where you can select a template to apply to the post list element.

Note: This will remove all the changes implemented to the current post list and import a new one.

Editing the Post List Design in the Thrive Architect Editor

While using the Thrive Architect Post List element, you can also edit the element like any other page content in the Thrive Architect editor.

This way, you can choose to remove a certain element from there or modify its structure.

Group editing is enabled at all times when you edit the design of this element, in order to keep consistency inside the “Post List” element. You can check out this article for more information about the “Group Styling” feature.

To do so, click the Edit Design button in the left column and start editing anything you want to edit within the element.

While editing the design, you can also add new elements from the right sidebar, elements that are currently available only for the Post List element!

So, if you open the list of elements by clicking on the plus sign from the right sidebar, while in “Edit Design” mode, you will see the following elements:

Some of these elements will be displayed on the “Post List” by default, as soon as you add it to the page (Featured Image, Post Categories, Post Content, Post Title, and Read More).

They are also displayed in the right sidebar, in case you remove them and then you want to add them back on.

Apart from those elements, you will also find the following:

  • Author Bio: Description about the author of the post (needs to be set up in the WordPress “Users” section)
  • Author Name: Name of the author (also set up within the WordPress “Users” section)
  • Author Image: Image of the author (set up on Gravatar)
  • Comments Counter: Shows the number of comments posted on the blog post
  • Post Date: Display the publish date of the post
  • Post Tags: Tags for the post set up within WordPress

Selecting a Layout or Display Type for the Post List

When you click on the Post List element, the Display type section in the left column allows you to select a layout for the posts. You can select a layout by clicking the one you want to apply.

The available layouts are as follows:

  • Grid: If the “Grid” setting is selected, the posts/pages/content will be displayed in columns. Each column will have a fixed height and spacing between them to form a perfect grid.
  • List: If this setting is selected, each post/page or item of content will be shown in a list format, one after another.
  • Masonry: This setting resembles the “Grid” because it will also display the posts/pages/content in columns. The difference is that there are no fixed heights for the columns (irregular layout, best visible when having two or more rows on your “Post List”).
  • Carousel: This will allow you to display the posts as a carousel. Here is a detailed article that’ll help you learn more about how you can display posts in a carousel.

Setting the Number of Columns in the Post List Element

When displaying a post list on the page, you can also decide the number of columns you want to include. This will distribute the total number of added posts into the selected columns.

To set the number of columns for the Post List element, click on the post list on the page, scroll to Columns in the left column, and use the slider to set the number you want.

Selecting the Number of Posts to be Displayed and Ordering/Sorting Them in the Post List Element

While setting up the post list element on the page, you can select the total number of posts/items you want to include. These posts can further be ordered and sorted as needed.

To select the number of posts/items for a post list, in the left settings column, click the Filter Posts button.

When you click the Filter Posts button, you’ll see a popup where you can select the type of content you want to include in the post list, filter them, and order or sort the ones you selected.

To order, sort and select the number of posts being displayed, scroll to the Order section in the popup.

In the Order section, you get options to:

  • Order posts randomly based on the date they are published or modified or their title, author, or comments.
  • Sort posts in ascending or descending order.
  • Display the specified number of posts.
  • Start displaying the posts from the specified number.
  • Modify the message shown when no posts are found.
  • Exclude the current post from the list being displayed.

Managing the Spacing Within the Post List Element

The Post List Element has settings for managing the horizontal and vertical spacing between posts displayed in the post list.

To manage the spacing in a post list element, click on the element on the page and scroll down to the Horizontal and Vertical Spacing settings under Main Options in the left column.

You can manage the spacing by dragging on the slider seen beside these individual settings.

Filtering Posts Displayed in the Post List

After you select the Post List template, it fetches the blog posts by default. The Filter Post option lets you filter the posts you want to show in the post list here.

To filter posts, click the Filter Posts button in the left column.

Once you click on Filter Posts, a popup will appear where you can scroll to the Filtering section and click Add Rule.

When you click Add Rule, you’ll see a field allowing you to select a factor to be considered while displaying the posts. These factors are as follows:

  • Category: to display posts based on the category they belong to.
  • Author: to display posts written by specific authors only.
  • Title: to display posts with a certain title.

Note: If you have multiple categories created, the Post List category filter won’t show the complete list of all the categories.

In case you’re looking for a specific one and you can’t see it in your list, simply start typing in the category in the dropdown and you will be able to find it and select it.

If the content type you’ve selected is pages, the filtering options you’ll see here are:

  • Name
  • Authors

If the content type you’ve selected is any Thrive Apprentice content, the filtering options you’ll see here are:

  • Name
  • Authors
  • Courses

Note: If you see an error that says you’ve selected multiple content types and the filtering criteria cannot be selected, here is a document that’ll help you resolve that.

You can select one of these factors and choose to display posts that fulfill the query.

You can also use this section to hide posts that meet the criteria you mention in the query.

After you’ve added the required filters, click the Save and Close button on the popup.

Do you want to display some recent posts or some that you want to highlight above others? In this case, you can display featured posts alongside the post list element.

To display featured posts above the regular post list, open the page in the editor, click on the post list on the page, scroll to the Show Featured Content setting in the left column, and enable the slider beside it.

When you enable the show featured content setting, a row will be added above the Post List on the page.

Click the Insert Featured Content List on the page to add featured content.

After you insert a featured content list, a popup will appear where you can select a template to display the content.

Once you select a template, a post will be featured above the others in the post list on the page.

Like the Post List element, you can style the Featured Content box using the settings in the left column.

Changing the Post/Page Type Displayed in the Post List

The Post List element fetches the blog posts by default. If you want it to pull in pages or custom posts, you can opt to do that.

To select the type of content for the post list, click on the Filter Posts button under the Main Options of the Post List element.

When you click the Filter Posts button, you’ll see a popup where you open the Custom Query tab and select the Content Type from the dropdown.

The options available in the dropdown are as follows:

  • Posts
  • Pages
  • Products (if you have WooCommerce installed and activated on the website)
  • Thrive Apprentice Lessons/ Modules/ Assessments (if you have Thrive Apprentice installed and activated on the website)
  • Thrive Ovation Display (if you have Thrive Ovation installed and activated on the website)

Like WooCommerce, Thrive Apprentice, and Thrive Ovation, you’ll see pages and posts associated with any other plugin installed and activated on the website.

You can select multiple Content Types in this field.

Additional Settings for the Post List Element (Related Posts, Pagination, Sidebar, etc.)

Alongside other settings, you can also manage the following:

Displaying Related Posts with the Post List

Alongside the Post List, you can display posts related to the post/page on which your “Post List” element is displayed.

To display related posts, click on the Post List element on the page and click the Filter Posts button in the left column.

When you click the Filter Posts button, a popup will appear where you click the Related Posts tab.

After you click the Related Posts tab, use the options that appear to set the criteria after which the posts should be displayed.

There are four criteria you can choose from here:

  • Category
  • Tag
  • Formats (eg, Video Post, Audio Post, Blog Article. Your theme defines these)
  • Author

For example, if you choose to filter the “Related Posts” by “Author,” then you can use the “Post List” element to display posts published by the same author that are related to the current post/page.

After setting the related posts in the popup, click Save and Close.

Customizing the Pagination in a Post List Element

The Post List Pagination Type option allows you to add pagination below your “Post List” items. This comes in handy if you display many posts on more pages of the “Post List” element.

By default, no pagination is added to the element.

To use this option, click on the field from the Pagination Type section. A small drop-down menu will open with three options.

  • None is the default state, meaning no pagination is added to the element.
  • Numeric: if you choose this option, a “Numeric” “Pagination” element will be added below your “Post List” element.
  • Load More: If you choose this option, a “Pagination” in the form of a “Load More” button will be added below your “Post List element.”

Need detailed help with pagination? This complete guide will help you set pagination for the post list element.

Customizing the Content Shown for Each Post

This option allows you to select how much should be displayed in the “Post List” element from the blog posts/pages/content items.

You can choose to display the posts/pages/content items:

  • In Full: this will show the entire content
  • In an Excerpt: this will display part of the content (you can set up in the WordPress editor of that post through the “Excerpt” option).
  • In a defined number of Words: here, you can choose the exact number of words you want to display from every post/page/content item. When you click on the “Words” option, the “Word Count” field will appear, where you can select or type in the number of words you want.

All you have to do is select one of these three options and then, in the case of “Words,” complete the necessary field about the respective option.

Adding a Read More Text

With the help of the Read More Text option, you can display a hyperlinked text at the end of the “Post List” items. This is for the cases when you choose to show an excerpt or a certain number of words from the post/page/content.

To display this hyperlink text, all you have to do is enter the text you want to be linked (eg, “Read more” or “Continue reading”) in the box using the “Read More Text” option.

After you do this, the text will be displayed at the end of every “Post List” item and linked automatically to the actual blog post/page/content from the “Post List.” Thus, when clicked, this linked text will send the visitors to the actual content from which they have read an excerpt.

Linking Entire Item to Content

The Link entire item to content option allows you to link entire items from the “Post List” element to the page/post/content they represent.

If you use this option, when someone sees the “Post List” element, they will not have to click on a specific title, button, or featured image from one of its items to be redirected to the post/page.

They will be able to simply click anywhere on the respective “Post List” item, and they will be redirected to the full page/post/content of that item.

If you want to use this option, you only have to click on the switch next to it.

Clicking the switch will ensure the items are linked to their post/page/content.

Note: If you activate the “Link entire item to content” option, all the other links from the “Post List” (for example, the links applied to buttons or images of an item, with the “Animation and Action” option) will be disabled.

These were the main sidebar options of the “Post List” element.

However, the more general options (such as the “Layout & Position” or the “Borders & Corners” options) are also available for this element. Since these are general options, we have separate tutorials on using them. You can check these tutorials out here.

Using the Rest of the Options

Just like in the case of other elements, besides the “Main Options,” you can use some other general options, as well (such as Layout & Position, Borders & Corners, etc.)

Next, here’s an article that can help you learn how to apply templates to pages and posts.

Was this article helpful?
Yes No

Related Articles

Need Support?

Can't find the answer you're looking for?
Contact Support
>