it-swarm.com.de

Kategorieliste mit untergeordneter Einrückungsliste unter der aktuellen Kategorie

Ich versuche, ein Widget zu erstellen, mit dem alle Kategorien auf oberster Ebene meiner benutzerdefinierten Taxonomie angezeigt werden, die Elemente enthalten. Wenn Sie auf eine der Kategorien klicken, werden Sie zu dieser Seite weitergeleitet und die aktuelle Kategorie wird im Seitenwidget fett dargestellt. Ich habe es geschafft, indem ich wp_list_categories() verwendet und die Klasse .current-cat gestylt habe.

Was ich jetzt tun möchte, ist, die Kinder dieser aktuellen Kategorie eingerückt und unter dieser aktuellen, fett gedruckten Kategorie anzuzeigen, wie folgt:

 enter image description here 

Wie soll ich das machen? Kann ich trotzdem wp_list_categories() verwenden.

Die Argumente, die ich derzeit für diese Funktion verwende, sind

$args = array(
    "taxonomy" => "kategori",
    "title_li" => "",
    "orderby" => "name",
    "order" => "ASC",
    "parent"  => 0
);
1
soomro

Ich denke, Sie sollten in der Lage sein, mit wp_list_categories() und ein wenig benutzerdefiniertem CSS das zu erreichen, was Sie brauchen.

Ich habe dies mit der Standardkategorie WP und einer benutzerdefinierten Taxonomie getestet.

Entfernen Sie zunächst den "parent" => 0 aus Ihrer wp_list_categories()-Funktion. Ich weiß nicht, woher du das hast.

Und stellen Sie auch sicher, dass Sie <ul> um Ihre Listenfunktion wickeln. wp_list_categories() scheint nur <li>s zu erzeugen, aber keinen Wrapper darum herum.

Ich habe diesen Code getestet:

$args = array(
    'taxonomy' => 'kategori',
    'title_li' => '',
    'orderby' => 'name',
    'order' => 'ASC',
);

echo '<ul class="category-list">';

wp_list_categories( $args ); 

echo '</ul>';

Damit sehen Sie bereits eine eingerückte, hierarchische Liste aller Kategorien. (OK ja, es hängt auch von Ihrem CSS-Thema ab, ob die Kinder eingerückt werden oder nicht)

Wenn nun eine Kategorie aktiv ist (dh wenn Sie sich gerade auf einer Kategorieseite befinden), hat das einzelne Listenelement dieser Kategorie eine spezielle Klasse, .current-cat.

Mit dieser Klasse können Sie die eingerückten Unterelemente (ul-Element mit der Klasse .children) einfach so ein- und ausblenden:

/* hide all sub menus */
.category-list ul.children {display:none;}

/* only show sub menus on the current cat */
.category-list .current-cat ul.children {display:block;}

Update: Gerade mit einer benutzerdefinierten Taxonomie getestet, funktioniert es ohne Probleme. Bearbeitet die obige Antwort.

Stellen Sie außerdem sicher, dass es einige Posts gibt, denen tatsächlich benutzerdefinierte Taxonomiebegriffe hinzugefügt wurden. Wenn Sie nur leere Taxonomiebegriffe haben, wird nichts angezeigt.


Update: Wenn Sie in einer Kategorie untergeordnete Seite sind, können wir auch einige CSS verwenden.

Das übergeordnete Menüelement in wp_list_categories() erhält auch eine spezielle Klasse, wenn Sie ein untergeordnetes Element anzeigen, .current-cat-parent.

Du könntest es also gebrauchen

.category-list .current-cat-parent ul.children {display:block;}

Oder den ganzen Ausschnitt

.category-list .current-cat ul.children,  
.category-list .current-cat-parent ul.children {display:block;}

Eine weitere Einschränkung, auf die Sie bei dieser Lösung stoßen, ist, dass wp_list_categories() reduziert wird, da keine speziellen Klassen generiert werden (da Sie sich nicht in einer Kategorieansicht befinden).

Vielleicht können Ihnen die Post-Klassen hier helfen, da sie einige benutzerdefinierte Klassen basierend auf der aktuellen Taxonomie/den aktuellen Begriffen wie diesem <taxonomyslug>-<termslug> generieren und diese Klassen zum aktuellen .post-Element hinzufügen.

Zum Beispiel:

kategori-kategoriterm
0
LWS-Mo