wp_list_bookmarks – > 12 Spielereien mit dem neuen template tag in WP 2.1-pimp your sidebar
WP 2.1 kombiniert Linkkategorien mit den Kategorien für Artikel. Was kann man mit wp_list_bookmarks alles machen. Worauf muss man bei wp_list_bookmarks achten und wie nutzt man dies für eine individuelle Art der Linkverwaltung und somit der Sidebar und Navigation.
Die Sidebar individuell zu gestalten liegt vielen am Herzen. WordPress 2.1 bietet dafür einen neuen template tag (wp_list_bookmarks) für die Links und da dieser noch sehr unbekannt ist und außerdem jede Menge Möglichkeiten bietet – hier zig Möglichkeiten was man damit alles machen kann.
Es wird ein langer Artikel, weil viel code;) Jede Möglichkeit ist als überschrift gekennzeichnet und ich empfehle Dir lies zuerst die überschriften, dann such Dir das aus, was Du haben magst. Wie immer habe ich keine Ahnung, ob copy and paste bei den Codebeispielen funktioniert. Schlimmstenfalls musst Du abtippen. 
get_links funktioniert auch bei WP 2.1 doch an alle, die von WP 2.0 irgendwas umgestiegen sind: Die IDs der Kategorien haben sich geändert:
Admincenter==>Verwaltung==>Kategorien==> dort findest du die neuen IDs Deiner alten Linkkategorien!
Außerdem zeige ich auch immer den erzeugten Quelltext an und bei den ersten Beispielen steht dabei, was für css IDs und classes zur Gestaltung zur Verfügung stehen. Wenn dies sich wiederholt verweise ich auf die Beispiele.
wp_list_bookmarks
Nur kurz was alles so kommt:
Alle Linkkategorien anzeigen. Alle Links aus jeder Kategorie anzeigen und die rotieren lassen. (random links). Nur eine bestimmte Anzahl anzeigen lassen, Links nicht mit Text, sondern Bild (Button) anzeigen, Rss Feeds Links, Links aus der Kategorie Y anzeigen lassen. Links mit überschrift, Links ohne überschrift usw....
0 Was kann wp_list_bookmarks alles-ein bisschen Theorie
<?php wp_list_bookmarks('argumente'); ?>
Dies bedeutet: Der template tag wp list bookmarks ist mit vielen Argumenten nutzbar. Die Argumente stehen zwischen Hochkommata und werden mit einem & verbunden/aneinandergereiht.
Wenn was nicht funktioniert war vielleicht bloß die Anordnung der Argumente falsch.
0. a Welche Argumente versteht wp_list_bookmarks aller ?
Die Argumente, die dieser template tag aller versteht und kann:
$defaults = array('orderby' => 'name', 'order' => 'ASC', 'limit' => -1, 'category' => '', 'category_name' => '', 'hide_invisible' => 1, 'show_updated' => 0, 'echo' => 1, 'categorize' => 1, 'title_li' => __('Lesezeichen'), 'title_before' => '<h2>', 'title_after' => '</h2>', 'category_orderby' => 'name', 'category_order' => 'ASC', 'class' => 'linkcat', 'category_before' => '<li id="%id" class="%class">', 'category_after' => '</li>');
Und jetzt praktische Beispiele mit wp_list_bookmarks.
1. Drei verschiedene Links, die in vier Kategorien gespeichert sind -Standardergebnis des wp_list_bookmarks
Folgendes in das Template der Sidebar (sidebar.php) schreiben:
<ul><--die ul habe ich dazugeschrieben--> <?php wp_list_bookmarks(); ?> </ul>
Dies ergibt dann das:
- wp_list_bookmark Standardergebnis
Titel der Kategorie 1
Link 1
Titel der Kategorie 2
Link 2
Titel der Kategorie 3
Link 3
Titel der Kategorie 4
Link 3
1.a Welchen Quelltext (html) erzeugt wp_list_bookmarks in der Standardeinstellung
Ohne die von mir ergänzten ul :
<li id="linkcat-6" class="linkcat"><h2>Blogroll</h2> <ul><li>Matt</li> </ul></li> <li id="linkcat-9" class="linkcat"><h2>meine Websites</h2> <ul><li><a href="http://www.texto.de/" rel="me" title="code is poetry">Texto</a></li> </ul></li> <li id="linkcat-1" class="linkcat"><h2>Nicht kategorisiert</h2> <ul><li><a href="http://www.webdesign-in.de/" rel="me" title="ausprobieren">ich</a></li> </ul></li> <li id="linkcat-2" class="linkcat"><h2>Test2</h2> <ul><li><a href="http://www.webdesign-in.de/" rel="me" title="ausprobieren">ich</a></li> </ul></li>
- Die css class linkcat zur Gestaltung steht zur Verfügung.
- Die Kategorien sind alphabetisch von A-Z geordnet.
- Die verschachtelte Liste der Sidebar von WordPress wird erzeugt.
- Die Kategorientitel sind in der überschrift h2 verpackt.
- Die IDs der Kategorien wird ebenfalls erzeugt: linkcat-2,linkcat-1 etc. Auch dies kann man zur Gestaltung nutzen, wenn man mag.
- Rel=me oder so gehört zum http://gmpg.org/xfn/11 Netzwerk, dort einfach nachlesen wieso warum und so .
2. Alle Links anzeigen, egal in welcher Kategorie, mit überschrift:Lesezeichen
<ul><--die ul habe ich dazugeschrieben--> <?php wp_list_bookmarks('categorize=0'); ?> </ul>
- Alle Links ohne Kategorie
Lesezeichen 
Lesezeichen
Link 1
Link 2
Link 3
2.a Der dabei erzeugte Quelltext (html) ist:
<li id="linkuncat" class="linkcat"><h2>Lesezeichen</h2> <ul><li><a href="http://www.webdesign-in.de/" rel="me" title="ausprobieren">ich</a></li> <li>Matt</li> <li><a href="http://www.texto.de/" rel="me" title="code is poetry">Texto</a></li> </ul></li>
- Die css ID linkuncat und die css class linkcat werden erzeugt und stehen zur Gestaltung zur Verfügung.
- Lesezeichen steht wieder zwischen h2.
- “Rel” wird ebenfalls dargestellt.
- Die Links sind alphabetisch von A-Z geordnet.
3. Alle Links anzeigen, egal in welcher Kategorie, mit eigener überschrift.
<ul><--die ul habe ich dazugeschrieben--> <?php wp_list_bookmarks('categorize=0&title_li=eigene überschrift'); ?> </ul>
3.a Der dabei erzeugte Quelltext (html) ist:
Absolut dasselbe wie bei 2.a oberhalb
4. Alle Links anzeigen, egal in welcher Kategorie, mit eigener überschrift und rotieren lassen.
<ul><--die ul habe ich dazugeschrieben--> <?php wp_list_bookmarks('categorize=0&orderby=rand&title_li=eigene überschrift'); ?> </ul>
4.a Der dabei erzeugte Quelltext (html) ist:
Absolut dasselbe wie bei 2.a oberhalb
5. Links ordnen mag ich.
Mit
orderby=rand
wird das Rotieren angegeben.
Du kannst auch noch nach id ( die ID des Links), url,name,target,description (das ist der title), owner (das ist der User, der den Link gespeichert hat),rating (wenn Du links bewertest), updated (wenn bei einem Link Neues kam),rel,notes(Du kannst ja zu jedem Link Notizen dazuschreiben),rss, length (die Länge des Linknamens, kürzere zu längere Namen ), ordnen.
Beispiele:
orderby=id Im template tag sieht das dann so aus: <?php wp_list_bookmarks('categorize=0&orderby=id&title_li=eigene überschrift'); ?>
oder
orderby=target Im template tag sieht dies dann so aus: <?php wp_list_bookmarks('categorize=0&orderby=target&title_li=eigene überschrift'); ?>
Nach zwei Kriterien zu ordnen ist nicht möglich.
6. Links nach Kategorien anzeigen, aber pro Kategorie maximal 2 Links.
<ul><--die ul habe ich dazugeschrieben--> <?php wp_list_bookmarks('limit=2'); ?> </ul>
6.a Der dabei erzeugte Quelltext (html) ist:
Absolut derselbe wie bei Beispiel 2a weiter oben.
7. Links nach Kategorien geordnet, pro Kategorie maximal 2 Links und die Beschreibung zum Link anzeigen.
- show_description
title Attribut 
<ul><--die ul habe ich dazugeschrieben--> <?php wp_list_bookmarks('limit=2&show_description=1'); ?> </ul>
7.a Der dabei erzeugte Quelltext (html) ist:
<li id="linkcat-6" class="linkcat"><h2>Blogroll</h2> <ul><li>Matt ebend er</li></ul></li> <li id="linkcat-9" class="linkcat"><h2>meine Websites</h2> <ul><li><a href="http://www.texto.de/" rel="me" title="code is poetry">Texto</a> code is poetry</li> <li><a href="http://www.esistkeinurlaub.de" rel="me" title="Einfach mal weg">Urlaub</a> Einfach mal weg</li> </ul></li>
Achtung: Haben die Links (a, a:link, a:visited etc) in der style.css ein display block angegeben, wird die Description- das title Attribut- automatisch in einer neuen Zeile darunter angezeigt!
8. Nur Links aus der Kategorie 9
- Links aus Kat 9
Kat Name als überschrift 
<ul><--die ul habe ich dazugeschrieben--> <?php wp_list_bookmarks('category=9'); ?> </ul>
8.a Der dabei erzeugte Quelltext (html) ist:
Absolut derselbe wie bei Beispiel 2a weiter oben.
9. Links nach Kategorien geordnet, aber nur die Kategorien mit der ID 9 und 6
<ul><--die ul habe ich dazugeschrieben--> <?php wp_list_bookmarks('category=6,9'); ?> </ul>
Achtung: Die IDs aufsteigend angeben.
Achtung: Anstatt der Kategorie IDs könnte man auch den Namen der Kategorie (category_name) angeben, doch dies hat bis jetzt bei mir noch nicht funktioniert.
Sollte ich diesbezüglich etwas in Erfahrung bringen, ergänze ich diesen Artikel.
9.a Der dabei erzeugte Quelltext (html) ist:
Du weißt es bereits: ==>Absolut derselbe wie bei Beispiel 2a weiter oben.
10. Zeige mir die Bilder /Buttons statt Linktexte und die Beschreibung (title Attribut)
- Buttons statt Text
kein Button da kommt Text 
<ul><--die ul habe ich dazugeschrieben--> <?php wp_list_bookmarks('show_images=1&show_description=1'); ?> </ul>
Achtung: Wie am Bild erkennbar ist. Wurde kein Button zum Link gespeichert, dann kommt automatisch der Linktext!
10.a Der dabei erzeugte Quelltext (html) ist:
An und für sich derselbe wie bei 2.a nur sind auch noch die Pfade zu den Buttons sichtbar. Wobei “img” keine eigene css class zugewiesen wird.
11. Zeige die Links aus Kategorie 9, gib den Links eine eigene css class, ohne title Attribut, geordnet nach deren URL
Das ist eines der Beispiele aus dem Codex, da das Original Beispiel derzeit falsches html erzeugt, habe ich es so abgeändert, dass es passt.
<ul><--die ul habe ich dazugeschrieben--> <?php wp_list_bookmarks('categorize=1&category=9&before=<li class="eigene">&after=</li>&show_description=0&orderby=url'); ?> </ul>
Achtung: Ich bin mir unsicher, ob dies so funktioniert, obwohl es im Codex steht.
11. a der dabei erzeugte Quelltext (html) ist:
<li id="linkcat-9" class="linkcat"><h2>meine Websites</h2> <ul><li class=\"eigene\"><a href="http://www.esistkeinurlaub.de" rel="me" title="Einfach mal weg">Urlaub</a></li> <li class=\"eigene\"><a href="http://www.texto.de/" rel="me" title="code is poetry">Texto</a></li> </ul></li>
Man mag ja nur eine eigene css class für was haben, damit man es eigens gestalten kann.
Ich würde auf die eigene css class verzichten alles mit before und after weglassen und dafür in der style.css diese li folgendermaßen ansprechen:
ul li.linkcat ul li
12. Ich brauche keine Titel, keine verschachtelte Liste wie geht denn das?
Dies fragte sich Olafb im WordPress-Deutschland.org Forum:
Dieses Html wollte er haben:
<div class="boxhead"> <h2>Links</h2> </div> <ul class="MeineKlasse> <li>...hier die Links....</li> </ul> </li> </div>
Zwei Lösungen eine von Olafb und eine von Jeriko, wenn man weniger Kategorien hat.
Alle Parameter leeren heißt das Zauberwort, dies sieht dann so aus:
<?php wp_list_bookmarks('orderby=rand&categorize=0&title_before=&title_after&title_li=&category_before=&category_after= '); ?>
die zweite Lösung von Jeriko, bei nur einer vorhandenen Kategorie:
<?php wp_list_bookmarks('title_li=&category=0&categorize=0'); ?>
Funktioniert was nicht, ändert sich was, habe ich die allerneuesten Urideen, dann editier ich den Artikel.
Hast Du noch Ideen etc, Fragen, Erkenntnisse etc. dann schreibe hier einen Kommentar. über Rückmeldung freu ich mich immer.
sehr schöner, verständlicher beitrag
danke dafür…
ogee14.02.07 11:56 | # |
Vielen Dank für diesen tollen Beitrag – sehr anschaulich und wirklich verständlich geschrieben
Gabi15.02.07 14:16 | # |
Wirklich klasse Auflistung der Möglichkeiten mit “wp_list_bookmarks()”! Vielen Dank!
Mich würde interessieren, ob es auch die Möglichkeit gibt, ganz auf die Erstellung einer Liste zu verzichten. Also, dass nur die Links ausgegeben werden!?
Würde mich über einen Tipp in dieser Richtung sehr freuen, denn Google schweigt sich (noch) aus.
Florian03.03.07 10:27 | # |
Hi Florian
ich fand bis dato auch nichts, selbst nach vielen ausprobieren,
wenn Du die Ausgabe nebeneinander haben magst, dann mache dies mit einer horizontalen Liste, also lass die ul und li aber zwinge die per css sich nebeneinander zu stellen.
horizontale Liste.
Klar ist dies nur ein Worcaround, aber besser sowas als gar keine Lösung denke ich mir
lg
texto09.03.07 17:49 | # |
Hi again.
Ja, genauso habe ich es dann auch gelöst. Musste dazu leider meine Sidebar komplett umbauen. (Das hatte ich mir aus purer Faulheit eigentlich erparen wollen!)
Aber nun gehts. Schade eigentlich, dass wp_list_bookmarks() das nicht kann, während eine andere neue 2.1-Funktion (wp_list_categories()) das drauf hat über “style=0″.
Aber danke für die Mühe.
Florian10.03.07 10:26 | # |
Florian kann sein, dass dies bald kommt, denn als ich mir die neue Funktion erarbeitete sah ich für kurze Zeit ein ähnliches Beispiel im englischen Codex,
doch da dürft was schief gegangen sein, denn die uls blieben nur die lis wurden damit gekillt..
vielleicht in einem der nächsten updates ..
wer weiß..;)
lg
texto10.03.07 13:38 | # |
Das hört sich gut an. Freue mich ohnehin schon jetzt auf 2.2 Final.
Mir fällt generell auf, dass die Masse der Template Tags und Funktionen in WordPress eher zusammengestückelt rüberkommt. Viele Funktionen, die letztendlich die gleiche bzw. ähnliche Aufgaben erfüllen (z.B. eine Liste von irgendwelchen Daten zu erzeugen) haben dennoch oftmals unterschiedliche Optionen und Konfigurationsmöglichkeiten. Wäre schön, wenn das mal etwas einheitlicher gestaltet würde.
Das Problem mit o.g. “style=0″ ist btw, dass nach jedem Link automatisch ein Zeilenumbruch eingefügt wird. Nicht jeder braucht den. Dies ließe sich umgehen, wenn es eine Option “before_link=” und “after_link” oder so etwas in der Art gäbe. Manche Template Tags unterstützen das schon jetzt. Aber man kann ja nicht alles haben.
Florian10.03.07 16:51 | # |
Guten Tag,
vielen Dank für deine Tipps! Denn noch habe ich ein kleineres Problem. Ich möchte, dass meine Links genauso ausschauen wie unten bei den Meta angaben oder bei den Bereich Testen. Ich habe dafür versucht mit linkcat und linkuncat zu arbeiten. Leider funktioniert das nicht. Würde mich freuen, wenn Du auf meine Seite schauen könntest und mir einen Lösungsvorschlag nennen könntest.
Danke!
Muckel06.05.07 14:40 | # |
Danke, ich war blind und konnte es lösen. Bei fragen dazu, bitte mail an mich. Danke!
Muckel06.05.07 14:45 | # |
Vielen Dank für diese Hilfestellung, aber leider reicht sie für mich nicht aus. Ich hoffe man kann mir hier helfen.
Ich möchte gerne, das Links und überschriften der einezelnen Kategorien auf mein CSS zurückgreifen und nicht dieses LINKCAT (wo finde ich das eigentlich?) benutzen?
Wer kann mir hier helfen. Im Firefox geht die Seite noch, aber im Safari auf Mac sieht das schrecklich aus, das die Links noch mal eingezogen sind …
Vielen Dank und viele Grüße
Alexx
Alexx31.05.07 17:32 | # |
hi Alexx
das geht nicht
du musst dann die css Angabe lincat in Deiner style.css eben ergänzen oder ergänzen lasssen,
lg
texto31.05.07 18:00 | # |
hi, danke für den schnellen hinweis.
Da ich in meiner CSS keine linkcat habe, muss ich den manuell hinzufügen? Verstehe ich das richtig?
Alexx31.05.07 18:03 | # |
ja
zb
lg
texto31.05.07 20:17 | # |
Hallo,
ich hab den Code 1 (Standard) in meine sidebar.php geschrieben. Es tut sich aber nichts. Meine Frage: an welche Stelle muss der Code geschrieben werden oder muss ich danach noch irgendwo was ändern oder einstellen?
In welcher Datei ändert sich dann der Quelltext.
Ich nutze die Version 2.2.3
mfg Liese
Liese08.10.07 13:27 | # |
Es ist eine super Idde und gut beschrieben, doch ich hänge an etwas:
Ich möchte zu erst den Seiten Namen fett gedruckt haben und dann die Beschreibung davon normal, soweit war ich:
<?php wp_list_bookmarks(‘categorize=0&title_li=0&before=&after=&show_description=1′); ?>
doch es wird alles fett gedruckt, gibt es da noch eine Möglichkeit?
Fröhliche Weihnachten!
Fabian
Fabian25.12.07 00:48 | # |
Hallo …,
ich hätte zu > 7. Links nach Kategorien geordnet, pro Kategorie maximal 2 Links und die Beschreibung zum Link anzeigen.
noch eine Frage. Im Visual zu 7. wird die Beschreibung in einer Linie nach dem Link selbst angezeigt.
Leider kann ich in keiner Weise die Beschreibung per CSS ansprechen. Gäbe es dazu auch ein Tip? Das wäre super. Ansonsten für diesen und ander Tips auf der Seite besten Dank.
JAN
JAN11.02.08 16:02 | # |
hi Jan
das geht, wenn du den Links dort ein display:block zuordnest…
Beispiel:
wobei die class eben von theme zu theme unterschiedlich sein kann,
lg
texto11.02.08 18:01 | # |
zu 18
es wird nach dem Link ein in den source geschrieben, dann kommt die Beschreibung und li zum schließen!
JAN11.02.08 21:11 | # |
zu 18 & 19 sorry wegen den tags!
also eine brake kommt nach dem Link!
JAN11.02.08 21:13 | # |
Jan wegen des Codes das geht in Ordnung, den lass ich aus Sicherheitsgründen halt hier nicht zu
bloß ich finde gar nirgends die Linkkategorien auf der Seite, da ist derartiges Chaos im Quelltext, dass ich es irgendwie überseh …;)
möchtest du alles in einer Zeile haben?
lg
texto11.02.08 21:58 | # |
Ist es möglich, Limks aus einer Kategorie, ohne den Titel der Kategorie mit anzeigen zu lassen?
Fabian05.03.08 17:43 | # |
Hi Fabian ja ist es
wo in de Sidebar oder in der Kategorienansicht etc..
lg
texto05.03.08 19:33 | # |
Hallo, ich möchte in meiner Seitebar Links aus einer bestimmten Blogroll-Kategorie anzeigen lassen…
Fabian05.03.08 19:49 | # |
Fabian
Beispiel 11 von oben
lg
texto05.03.08 19:58 | # |
Komisch, bei wir wird trotzdem der Kategoriename angezeigt…
Siehe meine Website, orangene Box.
Fabian05.03.08 20:08 | # |
mit dem Code auch..
ich glaube nämlich ich habe title mit Titel verwechselt … (sorry)
lg
texto05.03.08 21:32 | # |
Hallo!
Wenn ich in der Sidebar.php den bookmarks-Eintrag wie folgt ändere werden trotzdem auch Links aus anderen Kategorien angezeigt.
Bitte gib mir mal nen Denkanstoß, warum dass so ist.
Gruß, Matthias
Rezneuk22.08.08 09:47 | # |
hmm..
nutzt Du Widgets?
wenn ja, dann nutzen die ihren eigenen Code und nie das was man in die Sidebar.php geschrieben hat.
lg
texto22.08.08 12:41 | # |
Ah Danke, dass wird es sein. Muss ich mich nach Feierabend mal auf die Suche machen, wo der Code der Widgets steht.
Schönes Wochenende!
Rezneuk22.08.08 12:53 | # |
omg, danke. es hat mir viel geholfen. jetzt muss ich nur meine eigene class einfügen… <3
papalbina12.02.10 17:29 | # |
Vielen Dank für diesen Code damit man auch einzelne Kategorien ohne Überschrift / Titel anzeigen lassen kann, ich habe mich schon echt dumm und dusselig gesucht. Wusst gar nicht, dass man category UND categorize in einem Befehl ausführen kann damit das title_li= (Kein Titel eben) wirkt. Nur mir category ging dat ja leider nicht. Vielen Dank nochmal für den Tipp
Palloo06.04.10 10:55 | # |