HTML Grundgerüst
M (→Die mittlere SPalte col3) |
|||
Zeile 126: | Zeile 126: | ||
{include file=$modul.mod_template} | {include file=$modul.mod_template} | ||
{/foreach} | {/foreach} | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
</div> <!-- ENDE footer --> | </div> <!-- ENDE footer --> | ||
− | </div> <!-- ENDE page --> | + | </nowiki> |
+ | ===Hier endendie page und page_margin divs=== | ||
+ | |||
+ | <nowiki></div> <!-- ENDE page --> | ||
</div> <!-- ENDE page_margins --> | </div> <!-- ENDE page_margins --> | ||
</body> | </body> | ||
</html> | </html> | ||
</nowiki> | </nowiki> |
Version vom 21:03, 27. Aug 2006
Inhaltsverzeichnis |
HTML Grundgerüst
Die Dateien der HTML Templates sind im Verzeichnis /templates der Papoo Installation zu finden.
Aufgeteilt ist das HTML Grundgerüst, das ja die Struktur für das Layout bildet in:
- Kopf
- linke Spalte
- mittlere Spalte
- rechte Spalte
- Fuß
Das wird auch reflektiert in der /templates/__index.html, die als erstes geladen wird:
{include file="_kopf.html"} {include file="_inhalt_links.html"} {include file="_inhalt_rechts.html"} {include file="_inhalt_mitte.html"} {include file="_fuss.html"}
Übersicht der HTML Struktur
Eine grobe Übersicht über die Strukturierung kann man hier sehen:
Der Kopf der HTML Datei
Im Kopf werden die CSS Dateien eingebunden... Details dazu hier.
<html> <head> </head>
Der Body
<body> <div id="page_margins"> <div id="page" class="hold_floats">
Die beiden divs mit den ids:
- page_margins und
- page
umschließen die gesamte Seite.
Darin befindet sich optisch der Kopf:
Optischer Koopfbereich
Hier werden alle Module eingebunden die im Modulmanger im Kopfbereich eingebunden werden.
<div id="head"> <div id="head_content" class="clearfix"> {include file="_module_intern/mod_menue_sprung.html"} {foreach item=modul from=$module.1} {* <!-- Modul: {$modul.modlang_name}<br /> --> *} {include file=$modul.mod_template} {/foreach} </div> <!-- ENDE head_content --> </div> <!-- ENDE head -->
Hauptbereich
Der Hauptbereich umschließt die Bereiche col1, col2 und col3, sprich die linke, mittlere und rechte Spalte.
<div id="main">
Die linke Spalte col1
Die linke Spalte beinhaltet die beiden div Blöcke mit den ids:
- col1
- col1_content
die die linke Spalte umschließen. Alles was im Modulmanager dort hineingesetzt wird, wird hier optisch eingebunden.
{if $spalte_links OR 1} <div id="col1"> <div id="col1_content" class="clearfix"> {foreach item=modul from=$module.2} {* <!-- Modul: {$modul.modlang_name}<br /> --> *} {include file=$modul.mod_template} {/foreach} </div> <!-- ENDE col1_content --> </div> <!-- ENDE col1 --> {/if}
Die rechte Spalte col2
Die rechte Spalte erscheint im Quelltext zuerst, da mit Hilfe von CSS dieser Block nicht anders positioniert werden kann. Die ids:
- col2 und
- col2_content
umschließen die rechte Spalte.
{if $spalte_rechts OR 1} <div id="col2"> <div id="col2_content" class="clearfix"> <h2 class="ignoreornot">{$message_2187}</h2> {foreach item=modul from=$module.4} {* <!-- Modul: {$modul.modlang_name}<br /> --> *} {include file=$modul.mod_template} {/foreach} </div> <!-- ENDE col2_content --> </div> <!-- ENDE col2 --> {/if}
Die mittlere Spalte col3
Die mittlere Spalte beinhaltet normalerweise den Inhalt der Artikel. Die ids:
- col3 und
- col3_content
umschließen hier den gesamten Inhalt.
{if $spalte_mitte OR 1} <div id="col3"> <div id="col3_content" class="clearfix"> {foreach item=modul from=$module.3} {* <!-- Modul: {$modul.modlang_name}<br /> --> *} {* <!-- Template-Datei: {$modul.mod_datei}<br /> --> *} {include file=$modul.mod_template} {/foreach} </div> <!-- ENDE col3_content --> <hr class="clear_columns" /> </div> <!-- ENDE col3 --> {/if}
Der Fuß
Hier endet der Hauptbereich.
</div> <!-- ENDE main -->
Der Fuß mit dem div
- footer
umschließt den Fußbereich.
<div id="footer" class="floatbox"> {foreach item=modul from=$module.5} {* <!-- Modul: {$modul.modlang_name}<br /> --> *} {include file=$modul.mod_template} {/foreach} </div> <!-- ENDE footer -->
Hier endendie page und page_margin divs
</div> <!-- ENDE page --> </div> <!-- ENDE page_margins --> </body> </html>