Submenü je nach Hauptmenüpunkt einblenden

dummwiebrot

Hallo,

nachdem ich vor ein paar Jahren zu Drupal gewechselt habe, überlege ich jetzt, zu Wordpress zurückzukehren.
In den letzten 2 Wochen habe ich mich, erst mal offline, mit wordpress 3 beschäftigt und ein wenig mit den Möglichkeiten experimentiert. Zu einem Problem habe ich leider noch keine Lösung gefunden.

Ich habe ein horizontales Hauptmenü. Wenn ich jetzt den Menüpunkt Webdesign anklicke, möchtge ich, dass in der Sidebar ein Submenü mit weiteren Menüpunkten geöffnet wird. Wenn ich zu einer anderen Seite aus dem Hauptmenü gehe soll das Submenü wieder verschwinden.

Ich hab schon mit dem menu widget experimentiert, doch das wird dann dauerhaft in der Sidebar angezeigt, was ich halt nicht möchte, da es zu anderen Hauptmenüpunkten auch noch Submenüs gibt.

Weiß jemand eine Lösung?

Greetz dwb

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

egado

Du wirst entsprechende änderungen in deinen Theme-Dateien vornehmen müssen. Vermutlich wird dir dieser Artikel bereits weiterhelfen: http://www.tammyhartdesigns.com/tutorials/word…ges-in-sidebar/

Beste Grüße

Domino5702

Der Link von egado zeigt auf eine Lösung, die 4 Jahre alt ist, und u.a. nicht berücksichtigt, dass Menüs heute in WordPress anders angesprochen werden als früher (wp_list_pages() ist nur noch als Fallback vorhanden, der Standard ist wp_nav_menus()).

Ich hätte mal eine andere Lösung, und zwar mit jQuery:

Code

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script> <script>
   function mainmenu(){
       $(" .menu ul ").css({display: "none"}); // Opera Fix       $(" .menu li").hover(function(){
      $(this).find('ul:first').css({visibility: "visible",display: "none"}).show(400);
     },function(){
      $(this).find('ul:first').css({visibility: "hidden"});
     });
  }
     $(document).ready(function(){
                   mainmenu();
  }); 
</script>

Alles anzeigen

Dazu muss unbedingt über das Stylesheet entsprechend vorgegeben werden:

Code

#access{
     background-color: #333;
     height: 25px;
     font-size:16px;
     text-transform:uppercase
     }
.menu li:hover ul, .menu li li:hover ul, .menu li li li:hover ul, .menu li li li li:hover ul{
 display:block;
 position:absolute;
 z-index:5000;
 }

Alles anzeigen

Das z-index ist dabei nur als Prinzip, kannst damit experimentieren. Die einzelnen Klassen musst Du eventuell noch an Deine eigenen anpassen, das kann ja je nach Theme variieren. Aber der Ansatz müsste eigentlich so stimmen. Möglicherweise gibt es auch aktuelle Plugin-Lösungen dazu, habe jetzt nicht gesucht.

dummwiebrot

egado
Danke, aber mangels Englischkenntnissen leider für mich nicht zu gebrauchen.

Domino5702
auch Dir Danke.

Eine Plugin-Lösung würde ich auf jeden Fall bevorzugen. Vielleicht meldet sich hier ja noch jemand.

Greetz dwb

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Submenü je nach Hauptmenüpunkt einblenden

Jetzt mitmachen!