Collections

Collection pages serve as an index for other pages. It could be the home page or /books.

The main purpose of collection pages is to list related pages, i.e., all blog posts or all articles in a specific category.

Looping over pages

Usually, you will render all links in a loop. All pages are available through the $pages record.

@‎each(page in $pages.books.$pages)
	<a href="{‎{ page.path }}">
		{‎{ page.name.titleCase() }}
	</a>
@‎endeach

It prints the title-case version of the file name. If you wish to customise the title, you can add custom data to each page.

// pages/books/value-price-and-profit.mds
---
layout: Base
title: Value, Price and Profit
---

# Value, Price and Profit

// pages/books/index.stencil
@‎each(page in $pages.books.$pages)
	<a href="{‎{ page.path }}">
		{‎{ page.title }}
	</a>
@‎endeach

Items in $pages are sorted in alphabetical order. You likely want to order pages either by date or by a custom sort order.

// pages/books/value-price-and-profit.mds
---
layout: Base
title: Value, Price and Profit
date: 20/06/1865
order: 1
---

# Value, Price and Profit

The pages can now be sorted by date:

@‎each(page in $pages.books.$pages.sortBy('date'))
	<a href="{‎{ page.path }}">
		{‎{ page.title }}
	</a>
@‎endeach

Or by sort order:

@‎each(page in $pages.books.$pages.sortBy('order'))
	<a href="{‎{ page.path }}">
		{‎{ page.title }}
	</a>
@‎endeach

In some cases, you might only want to show certain pages:

// pages/books/value-price-and-profit.mds
---
layout: Base
featured: true
---

# Value, Price and Profit

@‎each(page in $pages.books.$pages.filterBy('featured', true))
	<a href="{‎{ page.path }}">
		{‎{ page.title }}
	</a>
@‎endeach