Codebeispiel - Einfaches Hauptmenü: Unterschied zwischen den Versionen
Aus DynPG-Wiki
K |
K |
||
(5 dazwischenliegende Versionen des gleichen Benutzers werden nicht angezeigt) | |||
Zeile 8: | Zeile 8: | ||
<code>[php, N] | <code>[php, N] | ||
<?php | <?php | ||
− | require '../dynpg/getcontent.php'; //DynPG-Funktionalität einbinden | + | require '../dynpg/getcontent.php'; // DynPG-Funktionalität einbinden |
− | $GLOBALS["DynPG"]->SetParam_PathToRoot('../dynpg/'); //DynPG-Pfad setzen | + | $GLOBALS["DynPG"]->SetParam_PathToRoot('../dynpg/'); // DynPG-Pfad setzen |
?> | ?> | ||
Zeile 46: | Zeile 46: | ||
</body> | </body> | ||
</html> | </html> | ||
− | |||
</code> | </code> | ||
Zeile 69: | Zeile 68: | ||
} | } | ||
− | /* | + | /* In allen divs innerhalb des Navigationsmenüs wird der Inhalt um 10 pt |
− | + | nach rechts verschoben. Durch die Verschaltelung von divs innerhalb des | |
− | + | Menüs erhalten wir so eine Einrückung gemäß der Hierarchie-Ebene. */ | |
div#course_categories_menu div { | div#course_categories_menu div { | ||
padding-left:10pt; | padding-left:10pt; | ||
} | } | ||
− | /* Alle | + | /* Alle Links innerhalb des Navigationsmenüs */ |
div#course_categories_menu a { | div#course_categories_menu a { | ||
text-decoration:none; | text-decoration:none; | ||
Zeile 82: | Zeile 81: | ||
</code> | </code> | ||
− | [http:// | + | [http://examples.gampers.ch/examples/code/simplemenu/index.php Beispiel ausführen] |
Aktuelle Version vom 25. April 2011, 11:48 Uhr
→ Hauptartikel: Implementation eines kompletten Hauptmenüs
Beschreibung: Ein Webseite mit einem einfachen dynamischen Navigationsmenü und einer Inhaltsanzeige.
Einfaches Hauptmenü - index.php
<?php require '../dynpg/getcontent.php'; // DynPG-Funktionalität einbinden $GLOBALS["DynPG"]->SetParam_PathToRoot('../dynpg/'); // DynPG-Pfad setzen ?> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US"> <head> <title>Seite mit dynamischen Navigationsmenü</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <link rel="stylesheet" type="text/css" href="style.css" /> <!--eigene style.css einbinden--> </head> <body> <h1>Seite mit dynamischen Navigationsmenü</h1> <div id="navigation"> <?php $GLOBALS["DynPG"]->SetParam_A_Anytime(true); // dynamische Navigation immer anzeigen $GLOBALS["DynPG"]->SetParam_A_Article(1); // Artikelnummer der dynamischen Navigation $GLOBALS["DynPG"]->SetParam_A_ArticleHeader(false); // Artikelkopf (Titel, Lead-Bild und Lead-Text) ausblenden $GLOBALS["DynPG"]->SetParam_A_CategoryNavigation(false); // Kategorienavigation (Gruppe > Untergruppe > Artikel) ausblenden $GLOBALS["DynPG"]->SetParam_A_PrintNavigation(false); // Drucken-Link ausblenden $GLOBALS["DynPG"]->Write_Article(); // dynamische Navigation ausgeben ?> </div> <div id="inhalt"> <?php $GLOBALS["DynPG"]->Write_AllGroups(); // Gruppenlisten-Ansicht ausgeben (standardmäßig abhängig vom Navigationskontext) $GLOBALS["DynPG"]->SetParam_AA_Maxview(10); // Maximal zehn Einträge in Artikellisten anzeigen $GLOBALS["DynPG"]->Write_AllArticles(); // Artikelliste-Ansicht ausgeben (standardmäßig abhängig vom Navigationskontext) $GLOBALS["DynPG"]->SetParam_A_Anytime(false); // Parameter wieder auf false setzen (wurde bei der Navigation auf true gesetzt) $GLOBALS["DynPG"]->Write_Article(); // Artikel-Detailansicht ausgeben ?> </div> </body> </html>
Einfaches Hauptmenü - style.css
/* Navigation */ div#navigation{ /* Angaben für ein zweispaltiges Layout */ float: left; width:150pt; margin-left:5pt; margin-right:5pt; border:1px solid black; } /* Inhalt */ div#inhalt { /* Angaben für ein zweispaltiges Layout */ margin-left:165pt; margin-right:5pt; } /* In allen divs innerhalb des Navigationsmenüs wird der Inhalt um 10 pt nach rechts verschoben. Durch die Verschaltelung von divs innerhalb des Menüs erhalten wir so eine Einrückung gemäß der Hierarchie-Ebene. */ div#course_categories_menu div { padding-left:10pt; } /* Alle Links innerhalb des Navigationsmenüs */ div#course_categories_menu a { text-decoration:none; }