New Post List Element Added to Thrive Architect
Thrive Architect just got better.
If you’ve just updated and are using it, you might have noticed something new at the bottom of your elements panel:
You may remember that we previously had a Post Grid element, but just improved it by adding a world of front-end editing and logic rules. We also renamed it as the Post List.
With this element, you can dynamically display a custom list of your posts anywhere on your site that will auto-populate when you publish new content. It’s a great way to keep your website visitors around by promoting content similar to what they originally came for.
Check out the video and read the post below to learn how to use this new element to bring unbeatable customization to your pages and posts.
If you’ve already used the legacy Post Grid element on your website, you have nothing to fear. These old elements won’t change when you update Thrive Architect and you’ll still have your editing capabilities in tact… but those legacy Post Grids won’t get any of the new features.
So instead, whenever you’re ready to make improvements, you can replace your Post Grids with the new Post List to get that added functionality.
What Exactly Is A Post List?
It’s… a list of your posts. But better.
The Post List element can be inserted on any landing page or blog post built with Thrive Architect and is designed to dynamically update with new content.
What does that mean? It means that if you configure the Post List to show 3 of your latest blog articles, then as soon as you publish a new post, all instances of the Post List element will update with your 3 most recent articles.
But as we’ll explore below, you can customize the element with specific logic rules to display only the posts that you need seen.
That makes it perfect for spicing up your website with creating sections like:
You’ll also be able to customize every inch of your Post Lists where changes will apply dynamically to all articles displayed in the list.
What's more, in our latest update, we added dozens of new templates for the Post List Element. This means you can easily pick one of our neatly designed Post List Templates and add it to your page with just a few clicks. Take a look at the most advanced WordPress Post Grid Builder, if you'f like to check out this new feature.
Let’s go over the basics first.
Post List Appearance:
When you first drop the Post List element onto a page, it will load a couple of posts by default. In the element sidebar, you’ll then have a few basic options you can quickly configure:
These basic settings let you make the big changes to how the Post List looks, from the display type, to the spacing and what content will be shown from the articles.
You can choose between List, Grid and Masonry.
List: This will show each article one after the next in a vertical scroll. It will look much like a regular website blog roll, except with much more customization.
Grid: This will create a series of columns with articles side by side. Each column will be the same height, forming a perfect grid.
Masonry: Similar to the grid, the Masonry setting creates columns, but each article will not be the same height. The element will dynamically shift articles around so they tessellate.
You can also choose how many columns you want displayed and adjust the vertical and horizontal space between your articles.
The Post List element will pull in the articles dynamically, so rather than editing the content of the articles on the page, you can select what content the element should display.
- Full: This will show the entire article’s content within your Post List.
- Excerpt: This will show all of the content up to your Read More tags.
- Words: You can select a specific number of words the Post List should show. These words will be taken from the start of each article.
Editing The Design:
Near the top of the element sidebar, you’ll see the option to ‘Edit Design’. When you click this button, you’ll go into a design view. You’ll know you’re in that view when the border becomes a pale peach color.
In this mode, you’ll be able to visually style your Post List element with all the same front-end styling controls you know and love from Thrive Architect, but with one key difference:
The changes apply to all articles inside the Post List.
So for example, if you change the heading size, font or color for one element, the changes will apply to all the articles in the Post List.
Adding New Elements Specifically for Post Lists
Whilst in the Post List editing mode, you have a variety of new elements available inside of your Thrive Architect sidebar.
But… these are not the regular elements you’re used to.
These are the new elements that will dynamically update depending on what articles are displayed. Have a look:
Yes, that means you can easily drag-and-drop these new elements onto the Post List editor window to add and style an author image, author name, read more button, comments counter, category, tag, and more… and it will update all articles to match.
Do you want a small circular image of the author? Easy.
Want to show how many comments each article has? Done.
Would you like to display the article category? One click and it’s there.
This is full front-end visual editing of dynamic components — unlike any other Post List element you’ll find — and it’s a true glimpse into our vision for Thrive Theme Builder.
Adding Standard Architect Elements
You can also add standard Architect elements to the Post List. These will apply to all instances, but will not dynamically update. Standard elements will be identical across the whole Post List.
That means you can add content boxes, change borders and padding, add icons, buttons and more… but the changes will be the same in all elements despite which post is shown.
Back in the elements sidebar next to ‘Edit Design’, there’s a grey button called ‘Filter Posts’.
But this ain’t no ordinary filter… it’s a beast!
Across the top, you have the option to choose either ‘Custom Query’ or ‘Related Posts’. Here’s what they do:
The Custom Query option includes stackable Display Rules.
By clicking ‘+ Add Display Rule’, you’ll have the option to include or exclude content that matches a rule.
You can then narrow down your filter by selecting specific categories, tags, authors or manually selecting posts. You can even choose to have multiple filters applied at the same time.
Here’s an example of two rules used together in a custom query. Note the number in the top right that shows you how many posts match the criteria. This is a nice touch to let you know if the filter you want to apply is too broad or too specific for the content you want to show in a particular Post List.
In our examples, we're showing how to use it to display posts. But the Post List element isn't limited to that. Just click the drop down in the top left and you can select to search for Posts, Pages... or more.
When you select the Related Posts setting, you can choose to display posts that are related to the article your Post List is currently displayed on by any of the following 4 options:
- Formats (ie: Video post, Audio Post, Blog Article. These are defined by your theme)
That means you can drop this element at the end of a blog post and filter ‘Related by: Author’ and your Post List will auto-populate with articles only published by the same author.
Slap a ‘Read more by this author’ headline above this Post List section, and it becomes a perfect addition to your post.
Choose Your Display Preferences:
Once you’ve selected your Custom Query or Related Posts, you can then edit how the Post List should display that content.
You can choose to arrange results by Date, Title, Author, Comments or Random. You can also arrange your results by Ascending or Descending order.
So if you want to show your latest posts, choose descending... but if you want to show your oldest posts, choose ascending.
This is also where you choose the number of articles to display in a Post List and where to start the count from. You might want to start the count at 5 — meaning the Post List will skip the first 5 articles that match the rules and display the next ones after that (great for drawing your readers deep into the archives of your content).
In the bottom right of this section, you’ll see a useful check box to ‘Exclude current post from list’.
Well, imagine you add this to the end of a blog post showing related articles. You don’t want it to link to the current blog post that your visitors have just read, do you? Easy solution: tick the box.
What’s Your Use Case?
So now that you’ve got the rundown on how the new Post List element works inside of Thrive Architect, how are you going to use it?
Maybe it’s to display a list of Podcast episodes, or as a homepage addition to invite first-time visitors to engage on your blog. Or perhaps you want to create some About the Author introduction pages on your website to show a list of each Author’s posts.
Whatever you’re thinking, let us know how you’re going to use the new Post Lists element by leaving a comment below!
P.S.: We’re not done improving the new Posts Lists element either… There’ll be something extra added to it in another update coming very, very soon.