I’m trying to create a blog page similar to Apple’s newsroom (Newsroom - Apple) where the newest blog post will be displayed at the very top as a larger card in a single column, instead of two. Is there a way to simply filter two separate collection lists, with the first set to display the newest post only, and the rest on the second list? I’m hoping to avoid having to implement a “featured” toggle if possible.
TIA!
alex
Here is my public share link: LINK
(how to access public share link)
Yep, two collection lists, both with the same binding, filtering and sorting. First one is limited start-1st-show-1. Second list is start-2nd-show-100.
Alternately if you need everything in a single grid, you can use custom CSS to make the first item take 2 columns.
Just adding to what Michael has said, for the approach using custom CSS, you could use something like this to target the first item of the collection list output:
.collection-list-class .collection-item-class:first-child {
/* Custom styles here */
}
In fact you can do that directly in the style panel now. Check out the first approach in the link above.