Tipps & Tricks für WordPress
WordPress & Co

Beitrags-Kategorien im WordPress-Dashboard farbig hervorheben

Du hast eine endlose Liste von Beitrags-Kategorien und brauchst eine optische Unterstützung, weil du dich gar nicht mehr zurechtfindest? Dann ist dieser WordPress Tipp genau das Richtige für dich. Kurz und einfach erklärt: Beim Schreiben eines Beitrags hast du in der rechten Seitenleiste ein Widget mit den Kategorien. Da bei manchen BloggerInnen diese Liste sehr lange werden kann, ist es manchmal schon sehr schwierig die Übersicht zu behalten. Wenn jetzt jede Kategorie mit ihren Unterkategorien einen passen farbigen Hintergrund bekommt (bspw.: Bücher = grün, Filme = blau oder Musik = rosa), dann sieht man die passenden Kategorien sehr schnell. Und genau diese Lösung bauen wir uns mit ein paar Zeilen zusammen.

Die Vorbereitung zum Hervorheben der Beitrags-Kategorien

Arbeite nie mit den Originaldateien des Themes, sondern lege dir vorher ein Child-Theme an. Denn nur so bist du sicher, dass nach einem Update des Themes deine Änderungen auch erhalten bleiben.

Die Stile für die Beitrags-Kategorien festlegen

Dafür brauchst du im Child-Theme ein neues Verzeichnis mit dem Namen /css. In diesem Verzeichnis legst du dir die Datei editor-cat.css mit einem Texteditor an. Dies ist eine reine Textdatei und du kannst dafür den Editor oder auch ein spezielles Programm zur Webentwicklung wie Notepad++ oder Sublime verwenden. So nebenbei, ich liebe Sublime, denn es macht das was es soll (und nicht mehr). Ich kann einfach und schnelle die Dateien eines WordPress-Themes bearbeiten und anpassen. In dieser Datei definierst du die veränderte Darstellung deiner Kategorien, wie in diesem Beispiel:

#tag-4, #category-4 {background-color: rgba(255,0,0,.5);}
#tag-7, #category-7 {background-color: rgba(0,255,0,.5);}
#tag-8, #category-8 {background-color: rgba(0,0,255,.5);}

Dies ist ja ganz einfacher CSS-Code, mit dem hat sicher niemand Probleme. Du definierst eine Hintergrundfarbe mit einem RGB-Wert (Farbanteile von Rot-Grün-Blau) und einer Transparenz. Durch die Transparenz wird die Farbe abgeschwächt und sieht eleganter aus. Vor den geschwungenen Klammern stehen die Kategorien. mit #tag-??? änderst du die Darstellung in der Verwaltung der Kategorien (Beiträge > Kategorien). Mit dem Eintrag #category-??? wird die Kategorie im Kategorien-Widget beim Beitragseditor formatiert.

Jetzt musst du nur noch wissen was die Zahlen hinter den Wörtern bedeuten und wo/wie du sie herausfindest. Die Zahl ist die ID (eindeutige Nummer), welche WordPress jeder Beitrags-Kategorie zuordnet. Du findest sie ganz einfach in der  Verwaltung der Kategorien (Beiträge > Kategorien) heraus. Sobald du mit der Maus über eine Kategorie fährst, erhältst du darunter ein kurzes Menü. Nun zeigst du mit dem Mauszeiger auf Bearbeiten und siehst am unteren Rand den Link dazu. Und genau da versteckt sich die ID. Du siehst da &tag_ID= und hinter dem Gleichheitszeichen siehst du die Zahl, welche du brauchst.

Die neue CSS-Datei der Beitrags-Kategorien in das DashBoard laden

Dazu brauchen wir nur ein paar Zeilen in der functions.php. In dieser Datei werden alle Themenfunktionen definiert und gespeichert. Und wir brauchen jetzt einen neuen Hook um die CSS-Datei zu laden. Dazu kannst du die folgenden Zeilen einfach am Ende der Datei anfügen.

//CSS fuer Beitrags-Kategorien laden
function tmdn_AddBeitragsCSS() {
  wp_enqueue_style('admin_css', get_stylesheet_directory_uri().'/css/editor-cat.css', false, '1.0.0');
}
add_action('admin_enqueue_scripts', 'tmdn_AddBeitragsCSS');

Diese 5 Zeilen machen nichts anderes als die CSS-Datei zu laden und im Dashboard zu verwenden. Damit hast du alles erledigt um die Beitrags-Kategorien farbig hervorzuheben. Natürlich kannst du deine CSS-Datei noch mit weiteren Kategorien oder Formatierungen ergänzen. Dann hast du die Liste der Kategorien genauso, wie du angenehm damit arbeiten kannst. Und gerade wenn du viel bloggst brauchst du jede Unterstützung, welche du bekommen kannst.

Hinterlasse eine Antwort

Deine eMail-Adresse wird nicht veröffentlicht. Pflichtfelder sind mit * markiert.