Eine Layoutdatei ist eine ganz normale HTML-Seite mit allem was dazu gehört. Layoutdateien dienen als Vorlage zum erstellen neuer Seiten und werden mit der Endung .tpl im Verzeichnis /content/layouts gespeichert.
Wichtig! Wenn keine Platzhalter vergeben und keine Menü- und Blockdateien angelegt werden, erscheint der Punkt "Bearbeiten" nicht im Adminmenü. Wenn diese Funktionsweise erwünscht ist, kann in der Datei "/settings/globalvars.php" die Variable $webutler_config['fullpageedit'] auf 1 gesetzt werden, um den Punkt "Aktuelle Seite bearbeiten" ins Adminmenü zu verschieben. !!!
Damit neue Links automatisch auf allen Seiten erscheinen, können Menüs in separaten Dateien gespeichert werden. Damit ein Menü geladen wird, muß der Dateiname mit Kommentarfeldern in die Layoutdatei bzw. Seite geschrieben werden. Format:
<!-- begin_menu_MENÜDATEINAME -->
<!-- menu_MENÜDATEINAME -->
<!-- end_menu_MENÜDATEINAME -->
Blöcke bieten sich an, wenn ein Inhalt auf verschiedenen Seiten angezeigt werden soll und man diesen Inhalt zentral ändern möchte. Die Formatierung ist gleich der für Menüs:
<!-- begin_block_BLOCKDATEINAME -->
<!-- block_BLOCKDATEINAME -->
<!-- end_block_BLOCKDATEINAME -->
Inhaltsbereiche, die sich im Editor öffnen sollen, werden in Kommentare eingefasst. Format:
<!-- begin_content -->
bearbeitbarer Inhalt
<!-- end_content -->
Die Kommentare sollten von einem HTML-Blockelement (am besten DIV) umschlossen sein und dürfen nicht verschachtelt werden, z.B. ein Menü innerhalb von <!-- begin_content --> und <!-- end_content -->.
Alle Menüs müssen als "Unordered List = UL" angelegt sein, damit sie mit den vorgesehenen Funktionen des Editors bearbeitet werden können!
Wenn eine eigene Fehlerseite angelegt wird, muß zur Ausgabe der Fehlermeldung folgendes in der Datei stehen:
<?PHP echo $webutlercouple->errorpagetext; ?>
Für ein reibungsloses einfügen neuer Spalten-Elemente ist die Vergabe von CSS-Klassen an die verschiedenen Seitenelemente zwingend erforderlich.
Wer die Spalten-Elemente nicht nutzen möchte, kann in der Datei /settings/globalvars.php die Variable $webutler_config['insertcolumn'] auf 0 setzen.
wb_menuelement - für Menüs
wb_blockelement - für Blöcke
wb_contentelement - für bearbeitbaren Inhalt
Die Klassen müssen an ein umschliessendes DIV vergeben werden. Andere Elemente wie SECTION, HEADER, FOOTER etc. werden nicht unterstützt.
Die Spalten-Elemente selbst haben die Klasse
wb_columnselement
Alle 4 Klassen werden benötigt damit neue Spalten-Elemente nur außerhalb von DIVs mit diesen Klassen eingefügt werden. Wenn die Klassen nicht gesetzt werden, könnten Verschachtelungen entstehen, die die Administration unbedienbar machen würden.
wb_menuelement und wb_blockelement ersetzen außerdem die alte Klasse "block_border" und wb_contentelement ersetzt die Klasse "content_border".
Unter dem Menüpunkt Seite > Spalten wird das neue Spalten-Element konfiguriert. Nachdem das Element ausgewählt wurde, kann es vor oder nach jedem in der Seite befindlichem DIV mit einem der 4 CSS-Klassen eingefügt werden. Wenn keine der Klassen existiert, können keine Spalten ausgewählt werden. Es sollte deshalb mindestens einmal die Klasse wb_contentelement in der Seite (bzw. Layoutdatei) stehen.
Spalten-Einstellungen wie z.B. Abstände können in der CSS-Datei "columns/columns.css" vorgenommen werden. Zu finden unter System > Stylesheets.
Alle mit den Klassen wb_contentelement oder wb_columnselement gekennzeichneten Spalten-Elemente können gelöscht werden.
Wenn Spalten im Editor eingefügt werden, werden sie mit grauer Umrandung gekennzeichnet.
Dem Menüpunkt der aktuellen Seite kann mit einer CSS-Klasse ein anderes Aussehen gegeben werden. Wenn ein verschachteltes Menü genutzt wird, kann die Klasse auch den Eltern-Elementen zugewiesen werden. Bei mehreren Menüs ist für jedes Menü eine andere Klasse möglich.
Virtuelle Kategorien können angelegt werden. Seiten werden einer Kategorie zugeordnet und bei Aufruf erscheint die Kategorie in der URL. Kategorien sind nur in der URL sichbar.
Das Hervorheben von Kategorien funktioniert ähnlich wie das Hervorheben von Eltern-Elementen bei einem verschachteltem Menü, stellt dabei aber eine Verbindung zwischen 2 separaten Menüs her.
Es können beliebig viele Unterkategorien und Untermenüs gesetzt werden.
Beispiel:
1. Es gibt ein Hauptmenü mit dem Menüpunkt "Services", der die Seite "info.phtml" aufruft.
2. Auf der Seite "info.phtml" gibt es ein zweites Menü mit den Seiten "service1.phtml" und "service2.phtml".
Jetzt will man, daß der Menüpunkt Services (Seite info.phtml) hervorgehoben wird, wenn man auf den Seiten service1.phtml oder service2.phtml ist. Dafür setzt man einfach alle 3 Seiten in eine Kategorie, z.B. "service", setzt eine CSS-Klasse für die Kategorie im Hauptmenü und das Häckchen bei "auch aktuelle Kategorie hervorheben".
Ergebnis:
Ruft man die Seite service1.phtml oder service2.phtml aus dem zweiten Menü auf, wird die Seite info.phtml im Hauptmenü hervorgehoben.
Wird das Häckchen bei "auch aktuelle Kategorie hervorheben" nicht gesetzt, wird die Seite info.phtml nicht hervorgehoben. Werden die Seiten service1.phtml und service2.phtml jedoch in eine Unterkategorie, z.B. "service/subservice", gesetzt, muß das Häckchen nicht gesetzt werden und info.phtml, also die Kategorie "service" wird hervorgehoben.
Wichtig! Wenn im selben Menü mehrere Seite die gleiche Kategorie nutzen, werden alle diese Seiten hervorgehoben.
<script> ... </script> und <?PHP ... ?> Codeschnippsel dürfen nur im <head> und <body> Bereich einer Seite eingefügt werden. Codeschnippsel die außerhalb von <head> und <body> gesetzt werden bringen die Validierung im Editor durcheinander.
Mit der Variablen $webutler_config['codeicon'] = "1" in der globalvars.php können Codeschnipsel via Icon sichtbar gemacht werden. Die Icons funktionieren nicht immer problemlos! Icons sind Bilder und Bilder sind nicht an jeder Stelle im Quellcode valide. Hat man z.B. eine Liste und möchte einzelne Listenelemente per PHP steuern, könnte der Quelltext so aussehen:
<ul>
<li>Punkt 1</li>
<?PHP if($a == 1) { ?><li>Punkt 2</li><?PHP } ?>
<li>Punkt 3</li>
</ul>
Im Editor sieht die Liste so aus:
• Punkt 1
[<>] • Punkt 2 [<>]
• Punkt 3
Gespeichert wird aber:
<?PHP if($a == 1) { ?><?PHP } ?>
<ul>
<li>Punkt 1</li>
<li>Punkt 2</li>
<li>Punkt 3</li>
</ul>
Wie man sehen kann wurden die Codeschnipsel vor das Blockelement (UL) verschoben. Default für $webutler_config['codeicon'] ist 0. Die Variable sollte nur auf 1 gesetzt werden, wenn Codeschnipsel, als <img /> gesehen, valide im Quellcode stehen.
Dateien wie CSS oder Javascript können dynamisch in eine oder alle Seiten geladen werden. Dafür muß die Datei an die Seite übergeben werden. Es 2 Möglichkeiten. Wenn allgemeine Dateien in alle Seiten eingefügt werden sollen, können sie über die Datei "settings/extradata.php" geladen werden. Einfach die folgenden Zeilen in die Datei kopieren:
$webutler_autoheaderdata[] = '<script src="headerscript.js"></script>';
$webutler_autofooterdata[] = '<script src="footerscript.js"></script>';
Wenn Dateien über Module geladen werden sollen, kann man folgendes in die Includedatei eingefügen:
$webutlercouple->autoheaderdata[] = '<script src="headerscript.js"></script>';
$webutlercouple->autofooterdata[] = '<script src="footerscript.js"></script>';
Machmal ist es nützlich den Dateinamen der letzten Seite zu kennen, z.B für Weiterleitungen oder als Alternative zu "history.back()". Dafür kann auf die Sessionvariable $_SESSION['history']['lastpage'] zugegriffen werden.
Wenn die Benutzerverwaltung installiert ist, werden die Authentifizierungsdaten des Users in der Sessionvariablen $_SESSION['userauth'] gespeichert.
Bei mehrsprachigen Seiten kann mit der Sessionvariablen $_SESSION['language'] die vom Besucher gewählte Sprache abgefragt werden.
In jedes auf einer Seite befindliche Formular wird ein zusätzliches, verstecktes Feld eingefügt. Sobald von einer Seite ein Formular per POST verschickt wird, wird der Wert des versteckten Feldes mit dem Wert der Sessionvariablen $_SESSION['antixpost'] verglichen. Das Formular wird nur versendet, wenn die Werte übereinstimmen. Diese Funktionsweise soll dabei helfen Spammerei ein wenig einzudämmen.