Layout von TYPO3-Webseiten

1. Das Layout unserer TYPO3-Webseite wird über eine HTML-Designvorlage in Kombination mit einer CSS-Datei bewerkstelligt. Die HTML-Vorlage (http://test.lugfrankfurt.de/fileadmin/vorlage.html) definiert dabei alle Inhaltselemente. Im Browser sieht sie relativ dürftig aus:

http://wiki.lugfrankfurt.de/Typo3Designvorlage?action=AttachFile&do=get&target=designvorlage.png

2. Der Blick auf den Code zeigt etwas mehr Struktur, da jedes Inhaltselement in einen div-Container eingebettet ist:

http://wiki.lugfrankfurt.de/Typo3Designvorlage?action=AttachFile&do=get&target=designvorlagecode.png

3. In Verbindung mit der CSS-Datei (http://test.lugfrankfurt.de/fileadmin/css/style.css) wird das Layout der Seite schon eher erkennbar:

http://wiki.lugfrankfurt.de/Typo3Designvorlage?action=AttachFile&do=get&target=designvorlagecss.png

4. Die Inhaltselemente können innerhalb der Vorlagendatei beliebig verschoben werden. Deren Design kann in der zugehörigen CSS-Datei ebenfalls nach Belieben angepasst werden. Der Zugriff auf die Vorlagendatei, bzw. das CSS-File erfolgt über das Menümodul Dateiliste->/fileadmin->vorlage->html->Kontextmenü:Bearbeiten

http://wiki.lugfrankfurt.de/Typo3Designvorlage?action=AttachFile&do=get&target=vorlagebearbeiten.png

lugfrankfurt: Typo3Designvorlage (zuletzt geändert am 2012-04-14 11:32:59 durch Harald Vajkonny)