Code für Responsive Toggle Menü gesucht (kein Plugin)

  • Für die Theme-Umstellung suche ich eine Art Toggle Menü (vielleicht wird es auch anders genannt?) für die Hauptnavi (also im Design oben im Querformat). Ich will 4-5 Hauptpunkte nebeneinander anlegen mit jeweiligen Sub-Navis. Die Subnavis sollen beim Daraufklicken (z.B. ipad) bzw. Mouse-Over (Desktop) aufklappen.

    Heißt also, dass das Menü auf verschiedenen Devices funktionieren muss. Ebenso auf dem Desktop bei möglichst vielen Browser-(Varianten).

    Responsive muss es auch noch sein, also sich an die Device-Breiten anpassen (lassen). Auf dem Smartphone z.B. woll dann nur noch das "Home-Symbol" sichtbar sein und ein "Menü-Button", der sich beim Draufklicken aufklappt und die 4-5 Hauptnavipunkte zeigt.

    Ich möchte den Code (php sowie css) direkt im Theme unterbringen, also keine Plugin-Variante.

    • Anzeige

    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

  • Wie wäre es mit Bootstrap? Eventuell basiert dein Theme eh schon darauf, dann benötigst du nur mehr einen angepassten nav_walker. Dazu findest du genug im Netz.

  • Ok, ich habe mir mal das angesehen:
    http://getbootstrap.com/components/#navbar-default

    Hier muss man leider auch beim Desktop immer auf den Menüpunkt (dropdown) klicken, um das Submenü zu sehen.

    Hmm...

    Das Hauptmenü (oben rechts) in diesem Theme https://twentyfourteendemo.wordpress.com/ gefällt mir. Ich werde wohl mal schauen mir dieses Menü anzupassen, Farbe etc. und dass es nicht oben rechts beim Scrollen "kleben" bleibt.

  • Ich verwende in meiner HP das "MAX-Mega-Menü".
    Kannst es gerne mal bei mir auch in Funktion ansehen: http://www.kgv-kuessow2.de.
    Es bietet sehr umfangreiche Einstellungsmöglichkeiten.
    Bei einigen Themes muss man ggf. in der header.php nacharbeiten, um das Menü für Mobile Geräte abzuschalten (in REM legen bzw. löschen), da Max-Mega-Meü es von Haus aus selber mitbringt. Der Responisive-Punkt ist da in den Einstellungen frei einstellbar.
    Evtl. hilft dir das schon weiter...

    Mfg Mike

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!