When working with collections like a portfolio or a blog you often want to list one or more posts on the homepage. My friend Philip Thygesen tipped me to use an entries field for this where the you can select an entry. If you don't select one it should fall back to the most recent entry in the collection. In this post I'll explain a quick and easy Antlers technique I started using a while back for incorporating this in my sites. In this post I'll assume you're using the Peak Starter Kit, although it's not needed at all.
Generate the page builder block
Assuming you already generated a a collection by running php please peak:add-collection
we can run php please peak:add-block
to generate a page builder block. This command will do the following:
Add a set to the replicator in
resources/fieldsets/page_builder.yaml
.Create a fieldset in
resources/fieldsets/your_block.yaml
.Create a partial in
resources/views/page_builder/_your_block.antlers.html
.
What we have to do now is edit the fieldset and the page builder block.
Editing the fieldset
So the client wants a selected entry or the most recent entry on the homepage. In order to do that we need an entries field for the client to select an entry. Let's pretend we're working with a projects collection. This could be our fieldset.
1title: Project 2fields: 3 - 4 handle: project 5 field: 6 max_items: 1 7 mode: default 8 create: true 9 collections:10 - projects11 display: Project12 type: entries13 icon: entries14 instructions: 'Highlight a project or show the latest.'15 localizable: true16 listable: hidden17 instructions_position: below18 read_only: false
The page builder block fieldset to select a recent project.
When the client doesn't select a post the partial should fall back to the most recent project. This is where the Antlers runtime parser comes in ❤️.
The Antlers logic
The Antlers runtime parser enables some magnificent ways of manipulating data. In order to fall back to a recent project when the user hasn't selected a project in the fieldset we can set an on the fly template variable called project
.
1{{# 2 @name Project 3 @desc The Project page builder block. 4 @set page.page_builder.project 5#}} 6 7<!-- /page_builder/_project.antlers.html --> 8{{ 9 project = block:project10 ? block:project11 : { collection:projects sort="date:desc" limit="1" }12}}13{{ partial:components/project }}14<!-- End: /page_builder/_project.antlers.html -->
The antlers code for falling back to the most recent project.
What happens here is that we set a variable called project
. By using a ternary operator we can attach data to the variable depending on a condition. If block:project
exists it means the user actually selected a project in our scoped project
field from the fieldset. In this case we simply attach that post to the variable. If the user didn't select a project we should fetch the most recent collection entry. The actual project will be fed into a reusable component in resources/views/components/_project.antlers.html
.
And that's it. A quick and easy technique you can use on almost all your Statamic sites that features collection and a page builder. Let me know what you think.