8.3 – Weitere Rezepte

Drei Rezepte, die auf dieser Website nicht zu sehen sind — sie stammen aus der Example-Vorlage für QuartzControl, aus der die Gestaltung hier kommt.

Der Aufruf nach dem Inhalt

options:
  html: >-
    <p><strong>Weiterlesen</strong><br />Diese Seite gehört zu
    <a href="{{root}}/">{{siteTitle}}</a>.</p>
  className: layout-box-cta
  frontmatterKey: layoutBoxCta
layout:
  position: afterBody
  priority: 20

afterBody, weil er die volle Textbreite braucht. Über layoutBoxCta: false nimmt ihn eine einzelne Seite wieder heraus — die Impressumsseite etwa.

Der Hinweis nur auf dem Smartphone

options:
  html: "<p>Das Menü liegt hinter dem Symbol oben links.</p>"
  className: layout-box-hint
  frontmatterKey: layoutBoxHint
layout:
  position: afterBody
  priority: 30
  display: mobile-only

Auf schmalen Bildschirmen verschwindet der Explorer hinter einer Schaltfläche. Ein Satz, der das erklärt, gehört genau dorthin, wo das Problem auftritt — und nirgends sonst.

Die Zeile in der Fußzeile

options:
  html: >-
    <p>{{siteTitle}} · Sprache: {{locale}} · Diese Seite:
    <code>{{slug}}</code></p>
  className: layout-box-colophon
layout:
  position: footer
  priority: 10

Ein Kolophon, das sich selbst schreibt: Titel, Sprache und Pfad kommen aus Platzhaltern. Auf einer Website, die ihre eigene Technik vorführt, ist das eine sinnvolle Zeile — auf einer, die etwas anderes zu sagen hat, ist es Ballast.

Zweisprachig wird das über byLang

Sobald in einem Schnipsel Text steht, braucht die zweite Sprache einen eigenen Eintrag. Die Example-Vorlage hat sieben Boxen, vier davon tragen Text — und genau diese vier stehen zweimal in der Konfiguration.