Dynamische Navigation: Unterschied zwischen den Versionen

Version vom 19. Oktober 2010, 13:51 Uhr

Beschreibung

Die dynamische Navigation ist Bestandteil des kostenlosen Grundmoduls von DynPG und bereits im Standard-DynPG integriert. Es ist keine separate Installation notwendig. Sie ermöglicht es Ihnen einfach und flexibel Navigationen auf Ihrer Homepage zu erstellen. Die Anwendungsmöglichkeiten gestalten sich dabei flexibel als normales Menü oder auch als Sitemap.

Ein dynamisches Menü bildet die Gruppenstruktur im Backend, also die Abfolge von Gruppen, Untergruppen und Artikeln in einer Gruppe, als Menü ab, macht also die logische Struktur ihrer Artikel aus dem Backend auf einer Webseite sichtbar und navigierbar. Der Vorteil ist, dass man im Backend neue Gruppen o.ä. erstellt und diese dann im Hauptmenü erscheinen. Dies ist auch bei Untergruppen nützlich, z.B. wenn eine neue Untergruppe Lokalnachrichten zur Hauptgruppe News hinzukommt.

Einrichten

Schritt 1: Artikel erstellen mit Platzhalter für die dynamische Navigation

→ Hauptartikel: DynPG Module einbinden

• 

  1. Wählen Sie im Menü des Backends Gruppen aus

• 

  2. Suchen Sie sich nun eine Gruppe, in der Sie einen Artikel erfassen wollen (z.B. Diverses).

• 

  3. Klicken Sie auf Artikel Formular anzeigen.

• 

  4. und danach auf Inhalt bearbeiten. Es erscheint der Editor.

• 

  5. In diesem wählen Sie das Symbol für die dynamische Navigation.

• 

  6. Geben Sie nun noch einen Titel ein und bestätigen mit einem Klick auf Erstellen.

• 

  7. Hat alles geklappt, können Sie im unteren Teil der Seite den neuen Artikel sehen.

Hinweis: Die ID des Artikels benötigen Sie erneut, wenn Sie in eine PHP-Datei mittels eines Globals die dynamische Navigation einbinden.

Schritt 2: PHP-Datei für die dynamische Navigation erstellen

Nehmen wir an, es würde folgende Ordner-Struktur vorliegen:

• http-docs/dynpg : hier liegt das DynPG-CMS
• http-docs/index.php : die Hauptseite Ihrer Website
• http-docs/folgeseite.php : eine andere PHP-Datei der Website
• http-docs/inc/navi.php : In diese Datei platziert man häufig den Code für die Navigation, dadurch ist er leichter wiederverwendbar

Den relativ komplexen Code der inc/navi.php kann man anhand der Musterwebsites nachvollziehen. Für eine genauere Erklärung der einzelnen verwendeten Globals siehe die Globals-Übersicht von DynPG und weiter unten die Funktionsübersicht der dynamischen Navigation:

• inc/navi.php:

<?php
  $GLOBALS["DynPG"]->SetParam_PlugIn_Template('DPGdynmenu', 'intelligent');
  $GLOBALS["DynPG"]->SetParam_PlugIn_Param('DPGdynmenu', 'real_expand', TRUE);
  $GLOBALS["DynPG"]->SetParam_PlugIn_Param('DPGdynmenu', 'order', Array('INDEX'));
  $GLOBALS["DynPG"]->SetParam_PlugIn_Param('DPGdynmenu', 'sort', Array('ASC'));
  $GLOBALS["DynPG"]->SetParam_PlugIn_Param('DPGdynmenu', 'href_page_groups', '../folgeseite.php');
  $GLOBALS["DynPG"]->SetParam_PlugIn_Param('DPGdynmenu', 'href_page_articles', '../folgeseite.php');
  $GLOBALS["DynPG"]->SetParam_PlugIn_Param('DPGdynmenu', 'href_page_detail', '../folgeseite.php');
  $GLOBALS["DynPG"]->SetParam_PlugIn_Param(
    'DPGdynmenu',
    'href_subpages',
    Array(
      0 => Array(
        'page' => '../formular.php{query}',
        'successors' => true
      ),
      21 => Array(
        'page' => '../blog.php{query}',
        'successors' => true
      ),
      15 => Array(
        'page' => '../sitemap.php{query}',
        'successors' => true
      ),
      16 => Array(
        'page' => '../veranstaltungen.php{query}',
        'successors' => true
      ),
      21 => Array(
        'page' => '../blog.php{query}',
        'successors' => true
      ),
      6 => Array(
        'page' => '../index.php{query}',
        'successors' => true
      )
    )
  );    
  $GLOBALS["DynPG"]->SetupTemplate('uneditable'); 
  $GLOBALS["DynPG"]->SetParam_A_Anytime(TRUE);
  $GLOBALS["DynPG"]->SetParam_A_CategoryNavigation(FALSE);
  $GLOBALS["DynPG"]->SetParam_A_PrintNavigation(FALSE);
  $GLOBALS["DynPG"]->SetParam_A_ArticleHeader(FALSE);
  $GLOBALS["DynPG"]->SetParam_A_Article(1);
 
  $GLOBALS["DynPG"]->Write_Article();
  $GLOBALS["DynPG"]->SetupTemplate('default');  
?>

Man kann nun in der index.php mittels

<?php include("inc/navi.php"); ?>

die Navigation einbinden, ebenso z.B. auch in der folgeseite.php.

Die dynamische Navigation kann nun an verschiedenen Stellen angepasst werden. Neben den Globals in der PHP-Datei (Globalsreferenz) ist dies im Backend durch das Erstellen von Gruppen und Artikeln möglich (Dynamische Navigation im Backend). Erweiterte Möglichkeiten ergeben sich durch das CSS und die Templates.

Die dynamische Navigation im Backend

→ Hauptartikel: Erstellen des Navigationsmenüs im Backend

Wie bereits erwähnt, bildet die dynamische Navigation die Gruppenstruktur des Backends auf einer Webseite ab. In der Musterwebsite 3 ist im Backend zum Beispiel folgende Gruppenstruktur zu erkennen:

.

Auf der Website sieht dies dann wie folgt aus:

Welche Untergruppen angezeigt werden, hängt zum einen davon ab, welcher Navigationspunkt gerade aktiv ist (also angeklickt wurde) und zum anderen von den benutzten Globals in der PHP-Datei und den Veröffentlichungseinstellungen der Gruppe im Backend.

Globalsreferenz

Dieser Abschnitt erklärt die Globals aus dem PHP-Code von Schritt 2 des Punkts Einrichten.

Hinweis: Die Parameter haben Default-Werte, müssen also nicht immer gesetzt werden.

Globals für das Plugin

• $GLOBALS["DynPG"]->SetParam_PlugIn_Template('DPGdynmenu', 'TEMPLATEORDNER');

Hiermit wählt man den Template-Ordner für die dynamische Navigation aus. Diese Template-Ordner liegen in dynpg/plugins/DPGdynmenu/templates. Aus diesem Ordner wird die Template-Datei menu.tpl zur Generierung des Menüs genommen. Dies ist unabhängig vom Global $GLOBALS["DynPG"]->SetupTemplate(...);, der sozusagen das Template des Artikels bestimmt, welcher die dynamische Navigation enthält.

• $GLOBALS["DynPG"]->SetParam_PlugIn_Param('DPGdynmenu', PARAMETERNAME, PARAMETERWERT);

PARAMETERNAME	PARAMETERWERT	Beschreibung
'order'	Array('INDEX') oder Array('NAME')	Reihenfolge der Gruppen in der Navigation nach Name oder im Backend gesetzten Index
'sort'	Array('ASC') oder Array('DESC')	aufsteigende oder absteigende Sortierung
'order_articles'	z.B. Array('INDEX')	sortiert Artikel in der dynamischen Navigation (falls diese angezeigt werden)
'sort_articles'	z.B. Array('ASC')	bestimmt aufsteigende oder absteigende Sortierreihenfolge der Artikel
'href_page_groups'	z.B. '../folgeseite.php'	Seite auf die standardmäßig weiterverlinkt wird bei einem Klick auf den Gruppennamen, sofern die Gruppe Untergruppen hat. Wird dieser Parameter nicht angegeben, so wird auf die aktuelle PHP-Seite verlinkt. (ACHTUNG '../' wichtig, siehe Ordnerstruktur weiter oben!)
'href_page_articles'	z.B. '../folgeseite.php'	Seite auf die standardmäßig weiterverlinkt wird bei einem Klick auf den Gruppennamen, sofern die Gruppe Artikel enthält. Wird dieser Parameter nicht angegeben, so wird auf die aktuelle PHP-Seite verlinkt. (ACHTUNG '../' wichtig, siehe Ordnerstruktur weiter oben!)
'href_page_detail'	z.B. '../folgeseite.php'	Seite auf die standardmäßig weiterverlinkt wird bei einem Klick auf einen Artikelnamen. Wird dieser Parameter nicht angegeben, so wird auf die aktuelle PHP-Seite verlinkt. (ACHTUNG '../' wichtig, siehe Ordnerstruktur weiter oben!)
'href_subpages'	z.B. Array( GRUPPENNUMMER => Array( 'page' => 'PHP-SEITE{query}', 'successors' => BOOLEAN ), ... ... ... GRUPPENNUMMER => Array( 'page' => 'PHP-SEITE{query}', 'successors' => BOOLEAN ) )	Ermöglicht es, für bestimmte Gruppen auf eine spezielle PHP-SEITE zu verlinken. Hierzu geben Sie anstatt GRUPPENNUMMER die Gruppennummer der Gruppe aus dem Backend ein. Statt PHP-SEITE fügen Sie den Namen und Pfad zur Zieldatei an, ausgehend vom Hauptverzeichnis des CMS!. Lassen Sie den Anhang {query} genau so stehen, falls in die Zieldatei auch DynPG über Globals eingeben wurde. BOOLEAN ersetzen Sie mit true wenn für Untergruppen dieser Gruppe auch auf diese spezielle PHP-Seite verlink werden soll, ansonsten mit false. Passen Sie auf, dass nach jedem GRUPPENNUMMER => Array(...) ein Komma notiert ist, allerdings nicht beim letzten.
'full_load'	false oder true	zeigt unabhängig von angeklickten Gruppen den kompletten Navigationsbaum mit Untergruppen an (oder auch nicht)
'full_load_articles'	false
'limit_articles'	false oder eine Zahl	Sofern dieser Parameter eine Zahl als Wert erhält, bestimmt er die Anzahl der Artikel pro Gruppe, die in der dynamischen Navigation angezeigt werden, wenn eine Gruppe statt Untergruppen Artikel enthält.
'expand_subtree'	Array(4) oder Array(4,5) etc.	zeigt die Untergruppen von Gruppe 4 (bzw. 4 und 5) in jedem Fall an. Sei Gruppe 4 bspw. die Gruppe News des Backends, dann werden die beispielhaften Untergruppen Lokalnachrichten und Weltnachrichten immer zur Navigation angeboten, auch wenn sich ein Benutzer auf der Website gerade einen Artikel aus der Gruppe Kontakt anschaut
'implode_subtree'	Array(4) oder Array(4,5) etc.	zeigt die Untergruppen von Gruppe 4 (bzw. 4 und 5) in jedem Fall NICHT an. Anmerkung: der Parameter expand_subtree überschreibt diese Einstellung! Ist also eine Gruppe in beiden Parametern aufgeführt, so werden die Untergruppen dieser Gruppe immer angezeigt, da der Parameter expand_subtree wichtiger ist.
'real_expand'	false oder true	Verwenden Sie das Template intelligent für die dynamische Navigation, setzen Sie diesen Parameter auf true, ansonsten auf false
'parent_select'	true
'max_depth'	null oder 0 oder 1 etc.	Tiefe bis zu der (Unter-)Gruppen angezeigt werden
'min_depth'	null oder 0 oder 1 etc.	Tiefe, die eine Gruppe mindestens haben muss um angezeigt zu werden, z.B. 1 um oberste Ebene der Gruppen aus dem Backend auszublenden
'fetch_only'	null oder int	Selektiert nur die angegebene Gruppe und deren Untergruppen oder alles falls null
'parse_article_lead'	false oder true	Falls true wird das Text ersetzen auf nicht leere Leadfelder der Artikel ausgeführt und kann zur Verlangsamung des Menus führen. Das sollte nur eingeschaltet werden, wenn der Lead innerhalb des Menus auch wirklich dynamischen Inhalt enthält, welcher dort auch angezeigt werden soll
'parse_group_shorttext'	false oder true	Falls true wird das Text ersetzen auf nicht leere Shorttextfelder der Gruppen ausgeführt und kann zur Verlangsamung des Menus führen. Das sollte nur eingeschaltet werden, wenn der Shorttext innerhalb des Menus auch wirklich dynamischen Inhalt enthält, welcher dort auch angezeigt werden soll
'hide_not_public_groups'	false oder true	Falls true werden nicht publizierte Gruppen und deren Untergruppen vom Menu nicht zurückgegeben

Sinnvolle Globals vom DynPG-CMS

• $GLOBALS["DynPG"]->SetupTemplate('uneditable');

ermöglicht Navigation in der Seite obwohl Editiermodus im Backend angeschaltet ist

• $GLOBALS["DynPG"]->SetParam_A_Anytime(TRUE);

Menü soll immer angezeigt werden

• $GLOBALS["DynPG"]->SetParam_A_CategoryNavigation(FALSE);

keine weitere Navigation(Breadcrumb) anzeigen

• $GLOBALS["DynPG"]->SetParam_A_PrintNavigation(FALSE);

kein Link zu Print-Seite anzeigen

• $GLOBALS["DynPG"]->SetParam_A_ArticleHeader(FALSE);

keine Artikelüberschrift (des Artikels mit dem DynMenü-Platzhalter) und kein Artikelleadtext anzeigen

• $GLOBALS["DynPG"]->SetParam_A_Article(1);

Artikel mit dem Dynmenü-Platzhalter setzen (Hier die Artikelnummer aus Einrichten einfügen!)

• $GLOBALS["DynPG"]->Write_Article();

Artikel ausgeben

• $GLOBALS["DynPG"]->SetupTemplate('default');

andere Teile der Website haben sicherlich andere Templates. Wir setzen daher hier wieder auf das Standard-Template zurück

CSS

Grober Aufbau

Die CSS-Dateien für die dynamische Navigation liegen im Verzeichnis dynpg/plugins/DPGdynmenu/styles. Die Datei menu.css ist hierbei meist die ausschlaggebende, so zum Beispiel in der Navigation der Musterwebsite 3.

Die dynamische Navigation wird von einem div-Tag mit der Id course_categories_menu umschlossen. Diese Angaben gelten also grundsätzlich für die gesamte dynamische Navigation und werden gegebenenfalls weitervererbt. Im menu.css der Muster-Website 3 steht beispielsweise:

div#course_categories_menu {
  margin: 0;
  padding: 0;
  width: 180px;
}

Wichtig: Um zu verhindern, dass die CSS-Angaben dieser Datei auch auf andere Teile der Website Einfluss haben, ist vor allen anderen CSS-Definitionen der Datei ebenfalls div#course_categories_menu notiert. Dadurch wirken sich die Angaben nur auf die dynamische Navigation aus.

Div-Tags für Gruppen oberster Ebene

<div id="course_categories_menu">
  <div id="group_fold_2"></div>  <!--Produkte-->
  <div id="group_fold_3"></div>  <!--Support-->
  <div id="group_fold_9"></div>  <!--News-->
  <div id="group_fold_4"></div>  <!--Über uns-->
  <div id="group_fold_5"></div>  <!--Kontakt-->
  <div id="group_fold_21"></div> <!--Blog-->
  <div id="group_fold_15"></div> <!--Sitemap-->
  <div id="group_fold_6"></div>  <!--Home-->
</div>

div#course_categories_menu div#group_fold_9 {
  text-decoration:blink;
}

div#course_categories_menu div#level_1_r_a_exp_hover,
div#course_categories_menu div#level_1_r_a_cll_hover,
div#course_categories_menu div#level_1_r_i_exp_hover,
div#course_categories_menu div#level_1_r_i_cll_hover,
div#course_categories_menu div#level_1_e_a_exp_hover,
div#course_categories_menu div#level_1_e_a_cll_hover,
div#course_categories_menu div#level_1_e_i_exp_hover,
div#course_categories_menu div#level_1_e_i_cll_hover {
  text-decoration:blink;
}

$GLOBALS["DynPG"]->SetParam_PlugIn_Param(
  'DPGdynmenu',
  'href_subpages',
  Array(
	33 => Array(
      'page' => 'counter.php?inc=http://www.google.com',
      'successors' => true
    )		
  )
);