3.3 – Dieselbe Box mehrfach

Das Plugin darf mehrfach in der Konfiguration stehen. Jeder Eintrag wird eine eigene Instanz mit eigenen Optionen und eigener Stelle.

plugins:
  - source: github:boxi-os/quartz-layout-box
    options:
      file: snippet.html
      frontmatterKey: layoutBoxNote
    layout:
      position: left
      display: desktop-only
 
  - source: github:boxi-os/quartz-layout-box
    options:
      file: snippet-mobil.html
      className: layout-box-mobil
      frontmatterKey: layoutBoxMobil
    layout:
      position: afterBody
      display: mobile-only

display

Wert	Wirkung
all	überall (Grundeinstellung)
desktop-only	erst ab der Tabletbreite
mobile-only	nur darunter

Die Umschaltbreite gehört der Site, nicht dem Plugin. Sie ist dieselbe, die auch Explorer und Inhaltsverzeichnis verschwinden lässt.

display blendet aus, es baut nicht um

Beide Boxen stehen im HTML jeder Seite; CSS zeigt nur eine davon. Für ein paar Zeilen Markup ist das gleichgültig, für ein eingebettetes SVG in zwei Fassungen wächst jede Seite um beide.

Jede Instanz braucht ihren eigenen frontmatterKey

Ohne eigene Schlüssel hören alle Instanzen auf dasselbe Feld — layoutBox: false blendete dann alle aus. Sobald es mehr als eine gibt, bekommt jede ihren:

options:
  frontmatterKey: layoutBoxNote     # statt des Standards layoutBox

Die vier Boxen dieser Website heißen layoutBoxMark, layoutBoxPageName, layoutBoxNote — und die vierte hat gar keinen, weil keine Seite sie je steuern soll. Warum das eine bewusste Entscheidung ist, steht in 8.2 – Die unsichtbare Box.

Auch className je Instanz

Alle Boxen tragen layout-box. Damit man sie im CSS auseinanderhalten kann, bekommt jede zusätzlich eine eigene Klasse — layout-box-mark, layout-box-note. Ohne die müsste man über Stellungen im Layout selektieren, was beim ersten Umsortieren bricht.