Support » Allgemeine Fragen » Active Klasse entfernen

  • Gelöst Elygor77

    (@elygor77)


    Hallo,

    ich suche eine Möglichkeit, die interne WordPress-Funktion zu deaktivieren, welche automatisch eine Klasse „active“ in wp-nav-menu erzeugt. Also jeder Link im Menü, den ich anklicke, erhält diese Klasse. Im Internet habe ich dazu leider immer wieder nur Filter-Aktionen gefunden, die die Klasse active ersetzen. Da ich aber mittels Script selbst die Klasse an bestimmten Elementen hinzufügen will, bringt mir das nichts. Die WordPress-Funktion überschreibt mein Script.

    Ich hoffe, jemand kann mir helfen. Das bringt mich aktuell zur Verzweiflung.

    Liebe Grüße
    Elygor77

Ansicht von 7 Antworten - 1 bis 7 (von insgesamt 7)
  • Zunächst könnte man natürlich überlegen, warum du die Klasse „active“ überhaupt im Style-Sheet nutzt, bzw. wie man die besonderen Stylesheet-Regeln für diese Klasse in einem Child-Theme oder eigenem Stylesheet aufhebt. Anschließend könnest du eine eigene Klasse verwenden, mit der du die bisherige Funktion der Klasse „active“ übernimmst.

    Wenn das keine Lösung ist, bleiben aber immer noch zwei Möglichkeiten:

    • „Quick & Dirty“ könntest du mit jQuery die Klasse .active entfernen und anderen Elementen diese oder eine andere Klasse hinzufügen.
    • die sauberere, aber aufwändigere Variante ist, einen eigenen Custom Walker zu schreiben. Dazu findest du im Internet einige Tutorials. Das Thema ist aber nicht ganz trivial.
    Thread-Starter Elygor77

    (@elygor77)

    Hallo und vielen Dank für die Antwort.
    Ich werde versuchen, meine Situation genauer zu erklären;

    Wie bereits gesagt, nutze ich eine Menünavigation, die ich über den Adminbereich verwalten kann. Das erzeugt mir letztendlich einen HTML Quellcode, der ungefähr so aussieht:

    <ul class="nav">
      <li class="menu-item">
        <a href="#"></a>
        <ul class="sub-menu">
          <li class="sub-menu-item">
            <a href="#"></a>
          </li>
        </ul>
      </li>
    </ul>

    Nun möchte ich eine Art „Akkordion“-Menü erzeugen, bei dem aber die Oberkategorie (also das a über sub-menu) trotzdem angeklickt werden kann und man auf die entsprechende Seite geleitet wird.
    Soweit so gut, es wird eine Klasse active auf diesem Element erzeugt und ich kann mittels CSS bspw. sagen: „li.menu-item a + ul-sub-menu: display:block;“

    Das funktioniert dann aber leider nicht mehr, wenn ich auf den Link einer Unterkategorie klicke, da diese dann automatisch die Klasse active bekommt und die Klasse beim Link der Oberkategorie entfernt wird.

    Vielleicht kann man das auch einfacher lösen, als ich es mir vorstelle? Irgendwo muss die Klassenvergabe ja erzeugt werden. Leider finde ich nur den Quellcode, in dem Klassen wie menu-item oder menu-item-has-child erzeugt werden, nicht aber active.

    Die jQuery-Variante á la .removeClass() und .addClass() habe ich bereits versucht, wird mir aber letzendlich von WordPress wieder überschrieben.

    Wie gesagt, die richtige Lösung wäre dann ein Custom Walker. Dazu gibt es ein gutes Tutorial.

    Thread-Starter Elygor77

    (@elygor77)

    Ich werde wohl nun doch einen Kompromiss eingehen müssen, in dem man die Oberkategorie nicht mehr anklicken kann. Dadurch habe ich im Endeffekt zwei Zeilen CSS und fertig. Alles andere würde leider den Arbeitsaufwand übersteigen.

    Vielen Dank für die Hilfe!

    Kannst du nicht einfach eine andere Klasse dafür nehmen:
    https://codex.wordpress.org/Function_Reference/wp_nav_menu#Menu_Item_CSS_Classes

    Gruß, Torsten

    Thread-Starter Elygor77

    (@elygor77)

    Hallo, ich konnte das Problem jetzt lösen.
    Manchmal ist es doch von Vorteil, das Ganze einfach mal ein paar Tage ruhen zu lassen und dann noch einmal zu schauen.

    Ich konnte tatsächlich die Klassen verwenden, die mir WordPress generiert. Das hatte ich wohl übersehen. Die Klassen current-menu-parent, current-menu-item, menu-item-has-children haben dann letztendlich für die Lösung gesorgt.

    Vielen Dank noch einmal an alle Helfenden!

    Edit: Bitte als gelöst markieren.

    Edit: Bitte als gelöst markieren.

    Das kannst Du als Thread-Ersteller selbst rechts in der Sidebar machen!

    Gruß, Torsten

Ansicht von 7 Antworten - 1 bis 7 (von insgesamt 7)
  • Das Thema „Active Klasse entfernen“ ist für neue Antworten geschlossen.