Menü-Sonderanfertigung für Website Baker
Freitag, 4. April 2008, 23:59 Uhr | Autor: ich
Für nicht zu umfangreiche WebSites benutze ich gerne das CMS Website Baker, da das Backend auch von Usern bedient werden kann, durch deren Adern keine Bits & Bytes fließen. ;O)
Einen Haken hat Website Baker: Wenn ein Menü verschachtelt ist, mit Sub- und SubSubMenüs, dann ist die eingebaute Funktion show_menu relativ unbrauchbar und das Modul show_menu2, welches man nachinstallieren kann, taugt leider auch nicht viel. Die Doku zu show_menu2 ist grottig und die Beispiele zeigen nicht das was ich haben möchte.
Mit der eingebauten show_menu-Funktion sieht ein Menü z.B. so aus:
Da diese Darstellung sehr unbefriedigend ist und immer nur der gerade aktive Menüpunkt hervorgehoben wird, habe ich an einer Systemdatei des CMS etwas rumgefingert und dann sieht das gleiche Menü folgendermaßen aus:
In die class.frontend.php von Website Baker 2.6.7 habe ich ab Zeile 367 (V 2.7: Zeile 381) folgendes eingefügt:
if (ROOT_PARENT==$page['page_id'] and $class==' class="menu_default"') {
$class = str_replace('menu_default"', 'menu_default level0"', $class);
} elseif (PARENT==$page['page_id'] and $class==' class="menu_default"') {
$class = str_replace('menu_default"', 'menu_default level1"', $class);
} elseif (LEVEL==0 and $class==' class="menu_current"') {
$class = str_replace('menu_current"', 'menu_current level0"', $class);
}
Und das CSS dazu enthält folgendes:
#menue { font-size: 0.8em; line-height: 25px;}
#menue ul { margin: 0; padding: 0; }
#menue ul li { list-style: none; display: inline; margin: 0; padding: 0;}
#menue ul li a { color: #222222; text-decoration: none; display: block; padding-left: 5px; background-image: url(../img/menu-bg.jpg); border-bottom: 1px solid #aeaeae; }
#menue ul li a:hover {background-color: #cccccc; }
#menue ul li a.menu_current { background-color: #cccccc; color: #000000; }
#menue ul ul li a {padding-left: 20px; background: #ebebeb; }
#menue ul ul ul li a { padding-left: 35px; }
#menue ul ul ul ul li a { padding-left: 45px; }
#menue ul li a.level0 { background-image: url(../img/menu-activ-bg.jpg); color: #FFF;}
#menue ul li a.level1 { background-color: #ebebeb; color: #066a38;}
Vielleicht bin ich auch nur zu dumm, um das Modul show_menu2 richtig zu benutzen, aber nach mehreren Stunden tüfteln, Googlesuche und Doku lesen, war es für mich sehr viel einfacher (und schneller) etwas am Website Baker Quellcode abzuändern, was nun genau das macht was ich will. Bei solchen Aktionen lernt man auch etwas über das Innenleben einer Open Source Software. :O)
Montag, 28. April 2008, 11:40 Uhr
Genau das suche ich!
Nur – ich teste Websitebaker 2.7 und damit sehe ich nur weisse Seiten, oder ich habe den Code an der falschen Stelle eingefügt.
Für einen Tip wäre ich dankbar.
Montag, 28. April 2008, 12:47 Uhr
Ich habe den gleichen Code auch in der Version 2.7 benutzt, wo es ebenfalls funktioniert, aber dort muß es nach Zeile 381 eingefügt werden.
Montag, 2. März 2009, 15:53 Uhr
Erst einmal vielen Dank für das hilfreiche Tutorial.
Leider erscheint bei mir auch nur eine weiße Seite nach dem Einfügen des Codes.
An welcher Stelle muss denn der Code konkret eingefügt werden:
http://project.websitebaker2.org/browser/trunk/wb/framework/class.frontend.php?rev=915
Vermutlich hat sich in der neusten Version die Zeilenzahl verändert.
Über eine Antwort würde ich mich sehr freuen!
Montag, 2. März 2009, 16:53 Uhr
Da Zeilennummern anzugeben nicht so wirklich sinnvoll ist… :O)
(...)if($page['link'] == $this->default_link AND !INTRO_PAGE) {
$link = WB_URL;
} else {
$link = $this->page_link($page['link']);
}
// Create values
#########################
if (ROOT_PARENT==$page['page_id'] and $class==' class="menu_default"') {
$class = str_replace('menu_default"', 'menu_default level0"', $class);
} elseif (PARENT==$page['page_id'] and $class==' class="menu_default"') {
$class = str_replace('menu_default"', 'menu_default level1"', $class);
} elseif (LEVEL==0 and $class==' class="menu_current"') {
$class = str_replace('menu_current"', 'menu_current level0"', $class);
}
#########################
$values = array($class,'<a href="'.$link.'" target="'.$page['target'].'" '.$class.'>', '</a>', $page['menu_title'], $page['page_title']);
// Replace vars with value and print
echo "n".str_replace($vars, $values, $this->menu_item_template);
// Generate sub-menu
if($this->menu_collapse==false OR ($this->menu_collapse==true AND
(...)Montag, 2. März 2009, 23:21 Uhr
Vielen Dank für die schnelle Antwort.
Ich habe meinen Fehler entdeckt.
Es lag nicht an der falschen Platzierung im Code, denn er war an der richtigen Stelle eingebunden. Das ´-Zeichen. Es muss das Hochkomma-Zeichen sein.
Achtung: Das Hochkomma-Zeichen wird hier ersetzt und darin liegt der Fehler!