Differences between revisions 3 and 4
Revision 3 as of 2012-04-14 11:32:59
Size: 1520
Comment:
Revision 4 as of 2019-01-22 19:01:20
Size: 0
Editor: JensKuehnel
Comment:
Deletions are marked like this. Additions are marked like this.
Line 1: Line 1:
= 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|{{attachment:designvorlage.png||width=500}}]]

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|{{attachment:designvorlagecode.png||width=500}}]]

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|{{attachment:designvorlagecss.png||width=500}}]]

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|{{attachment:vorlagebearbeiten.png||width=500}}]]