4.3 – Special forms

columns

options:
  variant: columns
  depth: 2
layout:
  position: footer

The first level as column headings, their children below. The grid fills the width with as many columns as fit at a minimum width of --quartz-nav-column-min-width (default 10rem). The classic footer sitemap.

columns.max

The option is meant to limit the number of columns but currently has no effect — the grid follows the width alone. For fewer columns, increase the minimum width.

select

options:
  variant: select
  title: Jump to
  select:
    button: false   # default

A <select> jump menu. First-level folders become option groups, their folder page appears in them as “Overview”; deeper levels are indented. As long as the current page is not in the list, the menu shows “Jump to…”.

How it navigates: chosen with the mouse, it goes right away. Chosen with the keyboard, it waits for Enter — otherwise the page would jump while you arrow through the options. select.button: true adds a “Go” button next to it, for sites that want an explicit step.

The menu navigates through Quartz’s own page transitions and needs JavaScript. Here title becomes the menu’s label.

Often a select is not the navigation itself but its mobile version: mobile: select puts the same menu in place of a list below the mobile breakpoint (6.1).

pager

options:
  variant: pager
layout:
  position: afterBody

“Previous” and “Next”, each with the title of the neighbouring page and an arrow. There is one below every text on this website.

In what order

options:
  pager:
    order: tree   # tree (default) | siblings

pager.order	Pages through …
tree	the whole scope in reading order: folder page, then its children, then the next folder
siblings	only the neighbours in the same folder; the end of the folder is the end

With tree the scope decides how far it goes (chapter 3):

• scope: root pages through the whole site — or through rootPath.
• scope: section stops at the end of the section.
• depth limits the depth.

Folders without a link target are skipped, as is a folder that leads to the same page as its first entry (3.3). On the first page “Previous” is missing, on the last “Next”; if a page has neither, nothing appears.

Labels

options:
  pager:
    labels: false   # arrow and title only

The words “Previous” and “Next” follow the page’s language on a multilingual site, otherwise the site’s language (7.3).