{Gelöst} Vertikale navigation

Für Fragen und Diskussionen zum Layout und Design, Templates und Stylesheets sowie Themes
Post Reply
noobforever
New Member
New Member
Posts: 5
Joined: Thu Oct 15, 2009 5:32 pm

{Gelöst} Vertikale navigation

Post by noobforever »

Moin Moin

Ich bin auf der suche nach ein Menü Template für eine vertikale Navigation.
Dabei soll wenn jemand auf eine Kategorie klickt darunter eingerückt die Unterpunkte erscheinen.
Am besten sollten die Navigation ohne Span Tag generiert werden.

Kann mir jemand helfen???


Vielen Dank im Voraus!

LG nfe
Last edited by noobforever on Sat Aug 14, 2010 9:22 pm, edited 1 time in total.
NaN

Re: Vertikale navigation

Post by NaN »

Hallo und willkommen im Forum.

Was Du suchst ist in der Regel die Grundlage dessen was alle mitgelieferten Menü-Templates bereits machen.
Selbst die horizontalen Menüs sind nur einfache Listen und lassen sich mit dem selben Template realisieren wie die vertikalen.
Ob nun horizontal oder vertikal wird durch Formatierung der Listen in den Stylesheets erreicht.

Versuch's einfach mal mit dem simple_navigation.tpl (da gibt es auch noch eine accessible-Variante).
Das sollte für die meisten Menüs eigentlich ausreichen.

Ob die Unterpunkte alle aufeinmal angezeigt werden oder nicht kannst Du mit Parametern regeln.
Schau Dir dazu mal die mitgelieferten Beispieltemplates an.
Such dort mal nach {menu ... } und schau Dir zur Erklärung der einzelnen Parameter die Hilfe des MenuManagers an. Dort werden alle Parameter beschrieben.

Bsp: {menu collapse=1} würde ein im MenuManager als Standard festgelegtes Menü-Template verwenden, aber erstmal nur die Punkte erster Ebene anzeigen.
Die Unterpunkte zu einem Menüpunkt klappen erst auf, wenn man den übergeordneten angewählt hat.

Das ist eine der Basis-Funktionen des MenuManagers und sollte ohne weitere Probleme auch von Laien leicht umzusetzen sein.

Wenn du dennoch weitere Fragen hast, Du weißt ja jetzt wo Du Hilfe findest ;)

In diesem Sinne viel Spaß mit CMSms.
Last edited by NaN on Wed Jul 28, 2010 11:36 am, edited 1 time in total.
noobforever
New Member
New Member
Posts: 5
Joined: Thu Oct 15, 2009 5:32 pm

Re: Vertikale navigation

Post by noobforever »

danke für die hilfe ;)


So klappt das ausklappen über die simple_navigation wunderbar, nur sie wird über die Span Tags generiert...

Wie kann ich die Navigation formatieren, sprich wo kann ich sehen wie ich sie ansprechen muss?
Zurzeit wird die Aktive Seite in der Navi mit einer h3 wiedergegeben ???

Edit:
hab jetzt das Menu Template Heruntergeladen und angepasst..

jetzt gibt es nur noch ein Problem die Menu ul hat ein padding von 40 px aber dies steht nirgendwo in der CSS woher könnte sie kommen? 

Wie kommt das bei Opera der Banner nicht angezeigt wird aber die Bilder, die über CSS laufen schon?



lg nfe
Last edited by noobforever on Mon Aug 02, 2010 12:51 am, edited 1 time in total.
NaN

Re: Vertikale navigation

Post by NaN »

noobforever wrote:
hab jetzt das Menu Template Heruntergeladen und angepasst..
Heruntergeladen?
Welches Template?
Das ist doch schon alles mit dabei.
noobforever wrote:
jetzt gibt es nur noch ein Problem die Menu ul hat ein padding von 40 px aber dies steht nirgendwo in der CSS woher könnte sie kommen? 
Entweder ist das bei diesem Browser standard, oder es steht doch irgendwo in einem anderen CSS.
Nimm doch mal Firefox und das Plugin Firebug.
Da kannst Du dann jedes einzelne Element untersuchen und Dir die Stylesheets dazu anzeigen lassen. Dann weißt Du auch woher irgendwelche Abstände kommen.
noobforever wrote:
Wie kommt das bei Opera der Banner nicht angezeigt wird aber die Bilder, die über CSS laufen schon?
Kann Dir hier leider keiner beantworten, da niemand weiß welches Seiten- bzw. Menü-Template Du nun eigentlich verwendest und welche Änderungen Du vorgenommen hast.
noobforever wrote:
Wie kann ich die Navigation formatieren, sprich wo kann ich sehen wie ich sie ansprechen muss?
Im HTML Quelltext?
Oder im MenuTemplate selber.
Dort stehen die Klassen und IDs als Kommentar oben drin.
noobforever wrote:
Zurzeit wird die Aktive Seite in der Navi mit einer h3 wiedergegeben ???
Die Tatsache, dass aktive Seiten als h3 angegeben werden, steht so im MenuTemplate.
Aktive Seiten müssen keinen Link haben, der auf sie selbst verweist.
Du kannst das aber im Template selber ändern indem Du einfach nach "{if $node->current}" oder eben nach "url" ' daraus machst. (Schau Dir dazu einfach an wie es bei anderen Links gelöst ist)
noobforever wrote:
So klappt das ausklappen über die simple_navigation wunderbar, nur sie wird über die Span Tags generiert...
Was genau stört Dich denn an den Span Elementen?
Die kannst Du bei Bedarf auch einfach aus dem Template löschen.
Last edited by NaN on Mon Aug 02, 2010 11:27 am, edited 1 time in total.
noobforever
New Member
New Member
Posts: 5
Joined: Thu Oct 15, 2009 5:32 pm

Re: Vertikale navigation

Post by noobforever »

Eins Vorweg bitte mein nick zu ernst nehmen. :P Ich arbeite nicht zum ersten mal Mit CMSms aber musste mich nie wirklich mit der Navigation auseinander setzten wie jetzt...
NaN wrote:
noobforever wrote:
jetzt gibt es nur noch ein Problem die Menu ul hat ein padding von 40 px aber dies steht nirgendwo in der CSS woher könnte sie kommen?   
Entweder ist das bei diesem Browser standard, oder es steht doch irgendwo in einem anderen CSS.
Nimm doch mal Firefox und das Plugin Firebug.
Da kannst Du dann jedes einzelne Element untersuchen und Dir die Stylesheets dazu anzeigen lassen. Dann weißt Du auch woher irgendwelche Abstände kommen.
*lach weg* Ich hab das Padding ja durch Firebug eindeckt.... und es gibt keine klasse die dies aufweist...

Opera und FF haben beide dieses Padding... 
NaN wrote:
noobforever wrote:
Wie kommt das bei Opera der Banner nicht angezeigt wird aber die Bilder, die über CSS laufen schon?
Kann Dir hier leider keiner beantworten, da niemand weiß welches Seiten- bzw. Menü-Template Du nun eigentlich verwendest und welche Änderungen Du vorgenommen hast.
Ich hab mir über FTP die simple_navigation.tpl heruntergeladen, dann als neues teamplate angelegt und die h3, span tags entfernt
NaN wrote:
noobforever wrote:
Wie kann ich die Navigation formatieren, sprich wo kann ich sehen wie ich sie ansprechen muss?

Im HTML Quelltext?
Oder im MenuTemplate selber.
Dort stehen die Klassen und IDs als Kommentar oben drin.
bin ja so nicht in die MenuTemplates gekommen, daher wusste ich nicht welche ich ansprechen sollte.. hatte sich ja aber schon erledigt...

nun nochmal das MenuTemplate

Code: Select all

{* CSS classes used in this template:
.activeparent - The top level parent when a child is the active/current page
li.active0n h3 - n is the depth/level of the node. To style the active page for each level separately. The active page is not clickable.
.clearfix - Used for the unclickable h3 to use the entire width of the li, just like the anchors. See the Tools stylesheet in the default CMSMS installation.
li.sectionheader h3 - To style section header
li.separator - To style the ruler for the separator *} 

{if $count > 0}
<ul>
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</li>
{elseif $node->index > 0}</li>
{/if}


{if $node->parent == true or ($node->current == true and $node->haschildren == true)}
<li class="menuactive_menuparent"><a class="menuactive_menuparent_on" href="{$node->url}">{$node->menutext}</a>

{elseif $node->haschildren == true and $node->type != 'sectionheader' and $node->type != 'separator'}
<li class="parent"><a class="parent" href="{$node->url}">{$node->menutext}</a>

{elseif $node->current == true}
<li class="currentpage">{$node->menutext}

{elseif $node->type == 'sectionheader'}
<li class="sectionheader">{$node->menutext}

{elseif $node->type == 'separator'}
<li class="separator" style="list-style-type: none;"> <hr />

{else}
<li><a href="{$node->url}">{$node->menutext}</a>

{/if}

{/foreach}
{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}
NaN

Re: Vertikale navigation

Post by NaN »

noobforever wrote:
Ich hab mir über FTP die simple_navigation.tpl heruntergeladen, dann als neues teamplate angelegt und die h3, span tags entfernt
[...]
bin ja so nicht in die MenuTemplates gekommen
[...]
Der MenuManager bietet auch eine Import-Funktion mit der man die Datei-Templates in der DB speichern und bearbeiten kann.
Mann muss dann nur im Seiten-Template beim {menu}-Tag den Parameter "template" entsprechend anpassen, dass das DB-Template verwendet werden soll.
Dann kann man sich dieses herunterladen etc. sparen.

Wenn Deine Liste ein padding von 40px hat, dann ist es entweder irgendwo so definiert, oder die Liste hat eben von Haus aus ein padding. Dann musst Du per Stylesheet eben sagen, dass kein padding haben soll:

Code: Select all


ul {
    padding: 0px;
}

Wenn das keine Auswirkung haben sollte, dann hast Du mit Sicherheit irgendwo noch ein padding für die Liste stehen.
noobforever
New Member
New Member
Posts: 5
Joined: Thu Oct 15, 2009 5:32 pm

Re: Vertikale navigation

Post by noobforever »

scheit so als hätte die Liste von aus aus ein Padding, das Padding ist aber bei allen MenuTemplates.

Wenn ich jetzt aber padding:0; eingebe muss ich die unterpunkte punkte selbst einrücken. Wie auf den Bild zu sehen wird die Kategorie(Wir über uns) mit eingerückt und die Usability geht verloren. Kann ich das irgendwie verhindern?
Attachments
menu.PNG
Last edited by noobforever on Tue Aug 03, 2010 2:32 pm, edited 1 time in total.
NaN

Re: Vertikale navigation

Post by NaN »

Hast Du mal einen Link zu der Seite, sodas man sich die Styles und die HTML Ausgabe mal anschauen kann?
Anders kann ich die Frage, warum da ein Element eingerückt ist, leider nicht beantworten.
noobforever
New Member
New Member
Posts: 5
Joined: Thu Oct 15, 2009 5:32 pm

Re: Vertikale navigation

Post by noobforever »

Ich hab es jetzt geschafft

Code: Select all

ul {
 padding: 0 0 0 20px;
}


Gibt es ein Modul für CMSms das von Bilder Bilder erzeugt und dann auch in den Content einfügen kann und beim drauf klicken vergrößert aber es soll keine gallery sein? 
Post Reply

Return to “Layout und Design”