Um ein Design für das EGOCMS zu erstellen muss ein neues Unterverzeichnis im skin Verzeichnis angelegt werden. Folgende Dateien werden mindestens erwartet:
- index.tpl
- style.css
Weitere Dateien in selber Ebene wie span.css, table.css, img.css, link.css, custom.css, script.js werden automatisch eingebunden.
Verwenden Sie eine admin.css Datei um bestimmte Style Anweisungen für den Inhalt und weitere WYSIWYG Editoren nur im Adminbereich anzuwenden.
Setzen Sie in Ihrer table.css für die CSS Selektoren die entsprechenden Element Namen ein, um festzulegen, ob diese für TABLE, TR, TH oder TD Elemente gelten.
table.red_table { background: red; }
tr.green_row { background: green; }
td.blue_cell, th.blue_cell { background: blue; }
td.blue_cell2, th.blue_cell2 { background: lightblue; }
Die index.tpl Datei beinhaltet das HTML Grundgerüst des Designs, in welchem Sie Smarty verwenden können. Die style.css Datei beinhaltet die dazugehörigen Style Anweisungen.
Der Inhalt der index.tpl Datei sollte in seiner Grundform wie folgt aussehen. Damit das neue Design die Frontend Administration unterstützt, muss ein Container mit dem Attribut data-edit-template="layout" existieren. Dieser Container muss kein zusätzliches Element sein, kann also auch ein von Ihrem Design bereits vorhandener Container sein:
<!DOCTYPE html>
<html lang="{$site->language}">
<head>
{include_head_tags}
{include_module_files}
</head>
<body>
<div data-edit-template="layout">
{include file=$typeTemplate}
</div>
</body>
</html>
Die style.css Datei wird automatisch über include_head_tags eingebunden.
Dieses Design kann nun in den Mandanten Einstellungen als Standarddesign oder Designvorlage ausgewählt werden.
Bei der Auslieferung des HTML Quellcodes an das Frontend werden alle data-edit-* Attribute automatisch gelöscht.
Bitte beachten Sie, dass {$page->field.content} bei der Verwendung von Blöcken nicht mehr genutzt werden kann. Seiten, die Blöcke beinhalten, speichern diese nicht in dieses Feld. Verwenden Sie stattdessen {$page->getContent()}. Aus Gründen der Abwärtskompatibilität speichert das Standard Template noch in dieses Feld und auch wenn die Frontend Administration deaktiviert ist, bzw. ein Seitentyp über frontend_ignore="1" in dessen type.ini von der Frontend Administration ausgeschlossen wird.