Layout erstellen

In der Frontend Administration haben Sie die Möglichkeit verschiedene Layouts zu definieren. Ein Layout definiert die Bereiche in denen vom Redakteur Blöcke eingebunden werden können. Typische Layouts nutzen z.B. die gesamte verfügbare Breite oder unterteilen diesen in zwei oder mehreren Spalten, in welcher jede eigene Zusammenstellungen an Blöcken besitzen kann.

Das Standard Layout muss mindestens existieren. Jeder Bereich in einem Layout muss einer Orientierung zugewiesen werden. Eine Orientierung dient dazu die einzelnen Bestandteile in unterschiedlichen Layouts außeinander halten zu können und um bei einem Layoutwechsel die bereits definierten Blöcke automatisch in die richtigen Orientierungen einzufügen. Die zentrale Orientierung sollte immer center benannt werden. Der HTML Code des Standard Layouts könnte so aussehen:

<main data-edit-template="center"> {$page->getBlocks("center")} </main>
warning

In Ihrem Design Verzeichnis muss eine layout.tpl Datei mit diesem oder ähnliches HTML Code existieren. Ohne wird die Frontend Administration nicht initialisiert.

wb_incandescent

Auch hier kommt es lediglich darauf an, dass es einen Container mit dem Attribut data-edit-template="ORIENTIERUNG" gibt. Sie können als Container alles verwenden was Ihr Design vorsieht.

Wenn Sie weitere Layouts anbieten möchten, erstellen Sie das Unterverzeichnis layouts in Ihrem Design Verzeichnis. Hier können Sie weitere .tpl Dateien anlegen, deren Bezeichnungen frei wählbar sind. Die Herachie der verwendeten Layouts sehen Sie hier:

  1. pub/theme/<THEME>/skin/<SEITENTYP>/layouts/bsp_layout.tpl
  2. pub/theme/<THEME>/skin/<SEITENTYP>/layout.tpl
  3. pub/theme/<THEME>/skin/layouts/bsp_layout.tpl
  4. pub/theme/<THEME>/skin/layout.tpl

Jede weitere Orientierung die Sie anbieten, entspricht gleichzeitig dem Parameter für $page->getBlocks(), welche die Blöcke für diese Orientierung lädt.

<main data-edit-template="center"> {$page->getBlocks("center")} </main> <side data-edit-template="right"> {$page->getBlocks("right")} </side>

Bei mehr als einem verfügbaren Layout erhalten Sie im Adminbereich unter dem Reiter Inhalt den Toolbar Button Layout, über welchen Sie zwischen den Layouts wechseln können.

Seitentypen können auch eigene Layouts anbieten. Dazu muss im Seitentyp Verzeichnis das Unterverzeichnis layouts mit entsprechenden Dateien existieren. Hat ein Seitentyp eine eigene layout.tpl Datei, dann wird dieses Layout als Standard Layout für diesen Seitentyp verwendet.

warning

Innerhalb eines Containers für eine Orientierung sollte kein weiteres HTML sein als das, was getBlocks() liefert.

warning

Sie können auch URL Suffix abhängige Layouts erstellen, wie z.B. layout.pdf.tpl, welche nur bei einer URL verwendet wird, die auf .pdf endet.