Navigation umschreiben in eigene Funktion

    Hallo liebe Wordpress-Experten

    Nun bin ich bei einem Grossen Punkt angekommen, welches ich nicht einfach lösen kann. Ich hatte schon immer Respekt vor Navigationen welche komplett dynamisch mit PHP augebaut werden, da ich dort nie richtig den Durchblick hatte.

    Ich habe eine Navigation bestehend aus DIVs (mit UL/LIs wars leider nicht lösbar), sie sieht so aus: http://elchalarm.net/blog/. Ich schreibe nun eine eigene Funktion (höchstwahrscheinlich mehrere) damit die WP Navigation entsprechend erstellt wird.

    Welche Parameter benötige ich dringends und welche Funktionen (zum Auslesen der Parameter) benötige ich als Grundstruktur aus der eigentlichen wp_nav_menu.php? (Meine PHP Kentnisse sind noch nicht sehr gut auf diesem Gebiet, deshalb bitte etwas Verständnis für Fragen die für andere selbstverständlich sind)[INDENT]PS: Es würde mir auch schon reichen wenn mir jemand sagen könnte, welche Funktionen ich in der wp_nav_menu.php abänderen (und die ganze Datei anderst benannt in functions.php beim Theme speichern) muss, damit er mir die Hauptnavi und die Subnavi (mit der Visible/Hidden Eigenschaft) diese zwei Divs anderst darstellt.
    [/INDENT]Ich würde mich sehr freuen wenn sich jemand ein paar Minuten Zeit nehmen würde um mir bei diesem Thema weiter zu helfen. Das ist das letzte Kapitel, welches ich abschliessen muss, um mit meinem Theme und meinem Blog online gehn zu können. (von kleinen Anpassungen abgesehen)

    Grüsse und gute Nacht
    der Elch

    Die schärfsten Kritiker der Elche waren früher selber welche... (eA*)

    • Gerade eben
    • 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

    Zitat

    (mit UL/LIs wars leider nicht lösbar)

    Das wage ich zu bezweifeln. Dem CSS ist es doch egal, ob es auf ein ul oder ein div angewendet wird.

    Davon abgesehen: Wieso willst Du die eingebaute Funktion umschreiben? Was genau stört Dich daran? Wäre die Aufgabe nicht eher, das CSS für das Menü anzupassen?

    Okey, Folgende Idee steckt dahinter:
    Ich habe die Hauptnavigation (nennen wir sie mal so) und ein Submenü welches beim über den Hauptnavipunkt fahren aufgeht. (Dropdwon, in meinem Fall Drupup mässig).

    Die Hauptnavipunkte sind ebenfalls links, sprich anklickbar. Und jetzt kommts.

    Wenn ich in der CSS Klasse ein li.mainnav > a habe (damit das ganze Li und nicht nur der Text im A-Tag) als Link zählt positioniert er mir das Submenü folgendermassen:

    Ist das Submenü relativ zum li, werden die restlichen Lis nach hinten verschoben, und zwar nämlich um die Breite des Submenüs (es ist wie mans sieht eine horizontale auflistung, keine vertikale)
    Positioniere ich es allerdings absolut so ignoriert es die "position" des Li-Tags und setzt sie absolut an den Browserrand.

    Was mich daran stört: Nun, das ganze hat zwei unterschiedliche Darstellungsarten, die Hauptmenüpunkte unterscheiden sich von denen im Submenü.
    ich will im Grunde nur meine Div Tags anstelle des Li-Tags setzen so dass es auch die richtige Klasse aus dem CSS File bekommt.

    Falls du Ideen hast wie man es lösen könnte, ich habe zuhause (bin zZ im Büro und hab nur zugang zu dem was auf dem Server liegt) die Versuche mit Li. Ich lad sie wenn du willst nochmal hoch und dann kann man nochmal testen.

    Die schärfsten Kritiker der Elche waren früher selber welche... (eA*)

    Zitat

    Wenn ich in der CSS Klasse ein li.mainnav > a habe (damit das ganze Li und nicht nur der Text im A-Tag) als Link zählt positioniert er mir das Submenü folgendermassen:

    li.mainnav > a wirkt aber auf den Link, nicht auf das Listenelement. Ich würde dabei ehrlich gesagt wenn möglich die LIs als unsichtbare Container nutzen und die A-Elemente so formatieren, dass sie wie gewünscht aussehen.


    Zitat

    Ist das Submenü relativ zum li, werden die restlichen Lis nach hinten verschoben, und zwar nämlich um die Breite des Submenüs (es ist wie mans sieht eine horizontale auflistung, keine vertikale)

    Das ist das, was reative Positionierung ausmacht: Man kann damit ein Element verschieben, aber es bleibt der ursprüngliche belegte Platz reserviert. Das brauchst Du also nicht.


    Zitat

    Positioniere ich es allerdings absolut so ignoriert es die "position" des Li-Tags und setzt sie absolut an den Browserrand.

    Hast Du dem Parent-LI-Tag denn dann aber auch "position: relative;" mitgegeben? Die absolute Positionierung richtet sich schließlich immer am nächsten *positionierten* Parent-Element aus oder am Body-Tag. Es müsste also so in etwa aussehen:

    Code
    ul#mainnav > li {
  position: relative;
}


ul#mainnav li li {
  position: absolute;
}


    Zitat

    ich will im Grunde nur meine Div Tags anstelle des Li-Tags setzen so dass es auch die richtige Klasse aus dem CSS File bekommt.

    Wenn eine Lösung mit li nicht gelingt, wäre zu schauen, ob man das HTML über Filter anpassen kann. Das wäre allemal besser als die ganze Methode zu kopieren. Da finde ich z.B. diese Filter:

    Zum Anpassen der CSS-Klassen der Menü-Einträge:
    http://adambrown.info/p/wp_hooks/hook/nav_menu_css_class

    Zum Anpassen des HTMLs:
    http://adambrown.info/p/wp_hooks/hook/wp_nav_menu_args (Mit ein bisschen Glück ist das genau das, was Du suchst!)
    http://adambrown.info/p/wp_hooks/hoo…v_menu_start_el

    k ich hab das nochmal angeschaut und es scheint tatsächlich so zu gehen mit Li (irgendwie hab ich damals etwas übersehen oder falsch probiert)

    http://testserver.elchalarm.net/newnav/

    Nun vielleicht noch eine kleine Hilfe (für das ist es zwar das falsche Forum aber da ich dieses Thema hier angefangen habe und es direkt damit zusammenhängt schreibe ich es hier rein)

    In Firefox, Opera und IE sieht es entsprechend rechts abgegrenzt aus.
    In Safari und Chrome sieht es entsprechend so aus wie es sollte (sprich wie die Variante mit Div Elementen. http://testserver.elchalarm.net/website/index220.html )

    Kann mir da vielleicht jemand helfen und sagen was noch nicht ganz stimmt. Wenn ich zum left: -90px; noch ein right: -90px; hinzufüge wird es zwar annähernd so wie es sollte aber halt wie es zu erwarten ist, immer gleich gross.

    Die schärfsten Kritiker der Elche waren früher selber welche... (eA*)

    Niemand eine Idee?

    Ich hab mal etwas rumboriert. Wenn ich alles in ein Li-tag packe dann geht es, nicht aber wenn um jeden a-tag herum ein eigener li-tag ist.

    Die schärfsten Kritiker der Elche waren früher selber welche... (eA*)

    Das geht nur mit a-Tags, weil diese inline dargestellt werden, denke ich. Es geht auch, wenn Du der Sub-Liste eine Weite gibst. Das geht aber ja leider schlecht, da Du ja nicht weißt, wie groß die einzelnen Menüpunkte sind.

    Sorry, bin gerade etwas im Stress und mir fällt kein guter Workaround dafür ein. :-/

    Man du bist ein ENGEL =)
    Ich hab bei ul.subnav li (also dem element wo die a-tags des Subnavs drin sind) float: left; rausgenommen und stattdessen display: inline; eingesetzt.

    Jetzt sieht es gemäss IE richtig aus. (Hab kein FF/Opera im Büro).
    Chrome stellt es auch richtig dar (das widerum hab ich im Büro xD).

    Scheint so als wäre das Problem nun gelöst, jetzt nur noch richtig in den Style einbinden =)

    (Scheint so als wäre das Thema Navigation vorläufig vom Tisch. Definitiv werd ich es heut abend sehn =)

    Die schärfsten Kritiker der Elche waren früher selber welche... (eA*)

    Andere Frage zum selben Thema.

    Im AP hab ich ja die Deisgn > Menüs > Anordnung im Theme wo ich Header, Footer oder Sidebar wählen kann.

    Meine indivuduelles Menü heisst "Headnav". ich habe folgenden Code in der header.php

    PHP
    <div id="navigation">
<?php wp_nav_menu( array('headnav' => 'Header Menu' )); ?> <!-- editable within the Wordpress backend -->
</div>

    Interpretier ich das richtig dass unabhängig davon was ich bei im AP bei "Anordnung im Theme" auswähle, immer das Menü Headnav an der stelle angezeigt wird, weil ich im Array 'headnav' definiert habe? (ursprünglich stand an der stelle glaub ich menu)

    Wenn ich jetz aber eine weiter Navigation in der Sidebar oder im Footer anzeigen will erscheint nichts, resp. immer das Menü Headnav.

    Über welchen Code kann ich das ausgewählte Menü darstellen und wie ist das mit dem Style? Im Style hab ich nun alles über die Klasse geregelt. Aber was wenn ich im Footer nen anderen Style haben will als im Header. Richtig dass ich dann über die ID das Style regeln muss?

    Code zur Navi, ergänzend zur Style frage:

    HTML
    <ul id="menu-headnav" class="menu"> ...

    Die schärfsten Kritiker der Elche waren früher selber welche... (eA*)

Jetzt mitmachen!

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

Benutzerkonto erstellen Anmelden