Menü in drei Ebenen

[operatorone]

Hallo,

nur gleich vorweg, ich bin Newbie auf CMSMS und habe damit nicht viel Erfahrung, deshalb brauche ich eure Hilfe.

Ich versuche mit dem Menu Manager eine Navigation zu bauen wie ihr sie auf http://www.buenalavista.de/ seht.
Darin sind alle Navgationspunkte einfach als hintereinander in einem DIV platziert. Per CSS bekommen die dann einen Abstand zueinander und alle Unterpunkte eines Hauptmenüpunktes sind von Anfang an ausgeblendet und sollen nur erscheinen, wenn auf einen Hauptpunkt geklickt wurde.

Ich habe nun aber folgendes Problem:
Alle Menüpunkte der drei Ebenen liegen in jeweils einem DIV.
Wie muss ich den Code Umbauen damit mir der MenuManager das erzeugt?

Hier mein Code:

Code: Select all

{* CSS classes used in this template:
#active - The active/current page
.sectionheader - To style section header
hr.separator - To style the ruler for the separator *}

{if $count > 0}
<div class="menu">
<div id="ebene1">
{foreach from=$nodelist item=node}
{if $doheaderlink == "1"}
{assign var="doheaderlink" value="0"}
<a href="{$node->url}">{$headertext}</a>
{/if}

{if $node->depth == 1 or $showchildren == 1}
{if $node->depth > $node->prevdepth}
{repeat string="" times=$node->depth-$node->prevdepth}
{assign var="listopen" value="1"}
{elseif $node->depth < $node->prevdepth}


{if $listopen == "1"}
{repeat string="" times=$node->prevdepth-$node->depth}
{assign var="listopen" value="0"}
{/if}
{elseif $node->index > 0}
{/if}

{if $node->current == true}
<a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a>
{elseif $node->type == 'sectionheader'}
{assign var="doheaderlink" value="1"}
{if $node->parent == true}

{* NOTE: Disabled showing of children here *}
{assign var="showchildren" value="1"}
{else}
{assign var="showchildren" value="1"}
{/if}
{assign var="headertext" value=$node->menutext}
{elseif $node->type == 'separator'}
<div id="separator">
{else}
<a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a>{/if}
{/if}

{/foreach}
{if $listopen == "1"}
{repeat string="" times=$node->depth-1}
{/if}

<div id="empty">
</div>
{/if} 

Der im Moment daraus resultierende Source-Code sieht so aus:

Code: Select all

<!-- start menu -->
<div class="navigation">
<div class="menu">
<div id="ebene1">
<a href="http://www.buenalavista.de/cmsms/">Startseite</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=profil">Agentur</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=profil">Profil</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=vorstand">Vorstand</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=referenzen">Referenzen</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=weblog">Weblog</a>
<a href="#">Presse</a>
<a href="#">2008</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=13-02">13.02</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=jobs">Jobs</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=projektmanagement">Login</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=projektmanagement">Projektmanagement</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=ftp-zugang">FTP-Zugang</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=kontaktformular">Kontakt</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=kontaktformular">Kontaktformular</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=anfahrtskizze">Anfahrtskizze</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=impressum">Impressum</a>

<div id="empty">
</div>
</div>
<!-- end menu -->

Aussehen soll es am Ende so:

Code: Select all

<!-- start menu -->
<div class="navigation">
<div class="menu">
<div id="ebene1">
<a href="http://www.buenalavista.de/cmsms/">Startseite</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=profil">Agentur</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=profil">Profil</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=vorstand">Vorstand</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=referenzen">Referenzen</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=weblog">Weblog</a>
<a href="#">Presse</a>
<a href="#">2008</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=13-02">13.02</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=jobs">Jobs</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=projektmanagement">Login</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=projektmanagement">Projektmanagement</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=ftp-zugang">FTP-Zugang</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=kontaktformular">Kontakt</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=impressum">Impressum</a>

<div class="ebene2">
<a href="http://www.buenalavista.de/cmsms/index.php?page=kontaktformular">Kontaktformular</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=anfahrtskizze">Anfahrtskizze</a>
</div>

<!-- Bei einer dritten Ebene sollen die Link wiederum in ein seperates Div geschoben werden.-->

<div class="ebene3">
<a href="http://www.buenalavista.de/cmsms/index.php?page=kontaktformular">Kontaktformular</a>
<a href="http://www.buenalavista.de/cmsms/index.php?page=anfahrtskizze">Anfahrtskizze</a>
</div>

<div id="empty">
</div>
</div>
<!-- end menu -->

Falls ihr meinen Lösungsansatz für kompletten Blödsinn haltet und vielleicht eine bessere Idee habt, lasst es mich wissen. Ich bin immer bereit was zu lernen.

Danke euch, euer Operator

[NaN]

Also ich halte das nicht unbedingt für kompletten Blödsinn.
Aber unnötige Arbeit.
Vor allem für einen Newbie 
Menüpunkte auf einer Webseite sollten nicht einfach nur in einem stehen.
Das Menü ist eine Art Inhaltsverzeichnis.
Und Inhaltsverzeichnisse sind von Natur aus Listen.
Und genauso wie Du die s stylen kannst, kannst Du doch auch die Menüliste stylen.
Ich würde einfach nur das simple_navigation-Template verwenden und mit Hilfe des Menüparameters "collapse" sagen, dass die Untermenüpunkte nur dann angezeigt werden sollen, wenn der jeweilige übergeordnete Inhalt angewählt wurde. (In diesem Falle collapse="1").
Den Rest dürftest doch Du mit Stylesheets hinbekommen.

[operatorone]

Danke für den Tip. Ich werde das mal versuchen und sehen wie weit ich komme. Ein wenig bedenken habe ich noch, weil ich noch nicht weiß wie ich die 2te Ebene links anfangen lassen kann. Wenn die in einer UL oder LI liegen fangen die Unterpunkte immer linksbündig mit dem Oberpunkt an oder kann ich das auch umstylen?

[cyberman]

Schau mal auf die CMSms-Themes-Seite - da gibt es ein Template, was ungefähr das macht, was du willst

http://themes.cmsmadesimple.org/index.p ... eturnid=17

[operatorone]

Vielen Dank für den Tip. Ich habe das Theme mal probiert, hab noch ein wenig Last mit den Sectionheadern, aber ich hoffe das noch hinzukriegen.

[operatorone]

Leider schaffe ich es nicht in dem Tabbed-Menu-Theme in der Navigation die Sectionheader sichtbar zu machen.
Im Menü werden nur parents dargestellt und als aktiver Link verfügbar gemacht.

gibt es eigentlich eine Sytax-Sammlung oder Tutorials zum Menumanager?

Danke fürs Helfen

[cyberman]

Hmm, zum ersten hast du die Modul-Hilfe, in der eigentlich der komplette Syntax des Moduls beschrieben wird.

Alles andere ist eigentlich reiner Smarty-Syntax

http://www.smarty.net/

Dann haben wir noch unser Wiki (dieseb Artikel leider noch nicht in deutsch)

http://wiki.cmsmadesimple.org/index.php ... nu_Manager

In einem anderen Thread hatte ich mal den Versuch unternommen, ein MM-Template zu erläutern

http://forum.cmsmadesimple.org/index.ph ... l#msg62062

[cyberman]

Leider schaffe ich es nicht in dem Tabbed-Menu-Theme in der Navigation die Sectionheader sichtbar zu machen.

Geht auch nicht so richtig. Auf cmsmadesimple.de hab ich für diesen Zweck einen Link verwendet, der auf die erste Unterseite verweist