English
About this handbook

This handbook belongs to the Quartz plugin quartz-layout-box. And it is built with it: this box is a layout box.

It comes from a Markdown file, not from the configuration — which way is better when is in The snippet.

8.3 – More recipes

2 Min. Lesezeit

Three recipes not on show on this site — they come from the Example template for QuartzControl, which this design is derived from.

The call to action after the body

options:
  html: >-
    <p><strong>Read on</strong><br />This page belongs to
    <a href="{{root}}/">{{siteTitle}}</a>.</p>
  className: layout-box-cta
  frontmatterKey: layoutBoxCta
layout:
  position: afterBody
  priority: 20

afterBody, because it needs the full text width. Through layoutBoxCta: false a single page takes it out again — the imprint, for instance.

The notice only on the smartphone

options:
  html: "<p>The menu is behind the icon at the top left.</p>"
  className: layout-box-hint
  frontmatterKey: layoutBoxHint
layout:
  position: afterBody
  priority: 30
  display: mobile-only

On narrow screens the explorer disappears behind a button. A sentence explaining that belongs exactly where the problem occurs — and nowhere else.

options:
  html: >-
    <p>{{siteTitle}} · Language: {{locale}} · This page:
    <code>{{slug}}</code></p>
  className: layout-box-colophon
layout:
  position: footer
  priority: 10

A colophon that writes itself: title, language and path all come from placeholders. On a site that demonstrates its own machinery that is a sensible line — on one that has something else to say it is ballast.

Two languages means byLang

As soon as a snippet holds text, the second language needs an entry of its own. The Example template has seven boxes, four of them carrying text — and exactly those four appear twice in the configuration.

Backlinks