HTML Grundgerüst
(Unterschied zwischen Versionen)
(→HTML Grundgerüst) |
|||
Zeile 1: | Zeile 1: | ||
<div class="breadcrump">Sie sind hier: [[Hauptseite]] / [[Papoo CSS Layout]] / [[HTML Grundgerüst]]</div> | <div class="breadcrump">Sie sind hier: [[Hauptseite]] / [[Papoo CSS Layout]] / [[HTML Grundgerüst]]</div> | ||
=HTML Grundgerüst= | =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: | Aufgeteilt ist das HTML Grundgerüst, das ja die Struktur für das Layout bildet in: | ||
Zeile 9: | Zeile 10: | ||
* Fuß | * Fuß | ||
− | Das wird auch reflektiert in der /templates/__index.html | + | Das wird auch reflektiert in der /templates/__index.html, die als erstes geladen wird: |
+ | |||
{include file="_kopf.html"} | {include file="_kopf.html"} | ||
{include file="_inhalt_links.html"} | {include file="_inhalt_links.html"} | ||
Zeile 15: | Zeile 17: | ||
{include file="_inhalt_mitte.html"} | {include file="_inhalt_mitte.html"} | ||
{include file="_fuss.html"} | {include file="_fuss.html"} | ||
− | ==Übersicht== | + | |
− | Eine grobe Übersicht über die Strukturierung kann man hier sehen | + | ==Ü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. | ||
<nowiki><html> | <nowiki><html> | ||
<head> | <head> | ||
</head> | </head> | ||
+ | === Der Body === | ||
<body> | <body> | ||
<div id="page_margins"> | <div id="page_margins"> | ||
<div id="page" class="hold_floats"> | <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"> | ||
<div id="head_content" class="clearfix"> | <div id="head_content" class="clearfix"> | ||
Zeile 32: | Zeile 47: | ||
</div> <!-- ENDE head_content --> | </div> <!-- ENDE head_content --> | ||
</div> <!-- ENDE head --> | </div> <!-- ENDE head --> | ||
+ | |||
+ | ===Hauptbereich=== | ||
+ | Der Hauptbereich umschließt die Bereiche col1, col2 und col3, sprich die linke, mittlere und rechte Spalte. | ||
<div id="main"> | <div id="main"> | ||
+ | |||
+ | |||
</nowiki> | </nowiki> |
Version vom 20:43, 27. Aug 2006
Sie sind hier: Hauptseite / Papoo CSS Layout / HTML Grundgerüst
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">