Firefox Stylish Für viele WordPress-Nutzer ist es unverständlich und einige ärgern sich sogar sehr, dass die Entwickler sich dazu entschieden haben Arial als „Standardschrift“ für den Admin-Bereich zu wählen.

Im Grunde genommen geht es um die folgende Deklaration in der global.css im Ordner /wp-admin/css/:

body, td, textarea, input, select {
	font-family: Arial, "Bitstream Vera Sans", Helvetica, Verdana, sans-serif;
	font-size: 13px;}

Wer sich ein bisschen mit CSS auskennt, der weiß was hier passiert. Ist auf dem System des Benutzers Arial vorhanden, dann wird Arial verwendet. Wenn nicht, dann schaut der Browser ob Bitstream Vera Sans vorhanden ist, wenn nicht, dann sucht er nach Helvetica usw. Und da Arial auf den allermeisten Systemen vorhanden ist – zumindest in der Windows-Welt – kommt natürlich in den meisten Fällen auch Arial zum Einsatz.

Im Artikel Design in WordPress 3.2 erklärt der Autor warum sich die Entwickler für Arial entschieden haben. Es geht darum, dass Helvetica auf dem PC keine gute Figur macht. OK, aber warum setzt man nicht Verdana oder Tahoma an der ersten Stelle. Beide Schriften machen in meinen Augen eine bessere Figur als Arial.

Arial aus WordPress-Backend entfernen

Wie auch immer gibt es bei der Lösung des Problems mehrere Lösungen. Als erstes könntest in der global.css die Anpassungen vornehmen, was aber nicht wirklich praktikabel ist, weil deine Änderungen beim nächsten Update futsch wären. Auf WordPress-Buch.de hat mich ein Kommentator auf zwei Lösungen aufmerksam gemacht: einem Plugin und einem Browserscript.

Da ich kein Plugin wollte, weil mich Arial in allen meinen Weblogs stört, musste eine Lösung her die global wirkt. Deswegen habe ich mich für eine Firefox-Erweiterung mit dem Namen Stylish entschieden.

WordPress-Backend ohne Arial

Nach der Installation dieses Addons kann man spezielle CSS-Regeln erstellen und diese auch nur an eine bestimmte URL koppeln, aber dadurch dass ich, wie schon oben erwähnt, mehrere Weblogs zu betreuen habe, musste ich eine globale Regel erstellen. Dafür konnte ich aber nicht auf die allgemeinen Element-Selektoren zurückgreifen (z. B. body), da dies alle Seiten betreffen würde.

Daher mussten Selektoren her, die nur im WordPress-Backend vorkommen. Folgende Regel für Stylish funktioniert bei mir:

.wp-admin *, #media-upload * {
    font-family: verdana, sans-serif !important;}

Ich gehe davon aus, dass es für andere Browser auch ähnlich einfache Lösungen gibt. Aber da ich Google Chrome, Opera und den IE9 nur zum Testen von Websites nutze, kann ich hier keine qualifizierte Aussagen machen.

Divi: Premium-Theme für WordPress
Werbung

Geschrieben von Vladimir

Vladimir Simović, arbeitet seit 2000 mit HTML & CSS und seit Januar 2004 mit WordPress. Im Laufe der Jahre hat er diverse Fachbücher und Fachartikel publiziert.

  1. Die Entwickler hätten „font-family: sans-serif;“ setzen sollen, dann wären alle glücklich geworden (Mac => Helvetica, PC => Arial).

  2. Man wird wohl um die Anpassung der ‚global.css‘ nicht herum kommen, wenn man auch anderen Nutzern von WordPress Arial ersparen möchte.
    Schade das man sich für diese Schrift entschieden hat.

  3. OK, aber warum setzt man nicht Verdana oder Tahoma an der ersten Stelle.

    Tahoma ist nicht Teil des Core fonts for the web und somit nur mit geringer Wahrscheinlichkeit auch auf Mac/Linux-Systemen anzutreffen (Liste der Apfel-Schriften). Verdana hingegen hat eine mangelhafte Unicode-Unterstützung.

    Vor allem die große Unicode-Unterstützung von Arial dürfte diese Schriftart, neben ihrer weiten Verbreitung auf diversen OS, zur ersten Wahl gemacht haben.

  4. Danke für den Tipp.
    Ich habe mir die Arial mit der Georgia eingesetzt.
    Finde diese viel angenehmer im Schriftbild.

  5. WordPress 3.2 online - Updates, Version, WordPress, Server, Backend, Schriftart - Adamantos Webworker Blog Mittwoch, 06. Juli 2011 am 13:06

    […] Im Backend gibt es jetzt eine andere Schriftart, die manchen nicht gefällt. Mit dieser Anleitung kann man die Schriftart überschreiben. […]

  6. Danke für den Tipp, das sieht doch gleich viel besser aus. 🙂

  7. Wusste bis grade eben gar nicht mal, das ich dass ändern kann mit der internen Schriftart bei WordPress. Danke für den Tipp und die Anleitung hier! 🙂

    Werde mir Arial dann auch mal durch Georgia ersetzen. :mrgreen:

  8. […] WordPress 3.2 – Arial im Backend durch andere Schriftart ersetzen! […]

  9. Vielen Dank, die Anleitung ist kurz und kompakt und man hat das Plugin innerhalb von einer Minute entsprechend eingerichtet.

    Genau das habe ich gesucht. Schade, dass man nicht das ganze WordPress-Backend auf den alten Stand (also visuell) zurücksetzen kann.

  10. […] perun.net wurde heute ein Tip veröffentlicht, wie man in der neuen WordPress Version 3.2 im Backend die […]

  11. Für Chrome habe ich folgendes Plugin gefunden:
    https://chrome.google.com/webstore/detail/acgbckcjlpneapibaifnhpjnnakijihm?hl=en#
    Netterweise befreit es auch gleich von Comic Sans

  12. Grundsätzlich existiert für Chrome ebenfalls Stylish als Plugin. Ich würde aber die von Steph vorgeschlagene Alternative vorziehen.

    MfG,
    Kai

    P.S.: Sehr guter Hinweis, danke sehr! 😉

  13. Danke, das hat geholfen!

  14. […] Safari-Plugin, welches man auch als Chrome-Extension runterladen kann. Firefox-User greifen auf das Plugin Stylish […]

  15. […] Für Firefox geht das mit der Erweiterung “Stylish“. Vladimir Simovic erklärt unter Perun.net wie es im Detail funktioniert.Die Adminbar wurde deutlich überarbeitet, dafür entfällt das […]

  16. […] ist die Vorgehensweise, die ich im Artikel WordPress 3.2: Arial im Backend ersetzen beschrieben habe nicht mehr notwendig … müsste ich noch testen um dies auch zu […]

  17. […] Safari-Plugin, welches man auch als Chrome-Extension runterladen kann. Firefox-User greifen auf das Plugin Stylish […]

  18. […] vornehmen muss. Eine solche Lösung bietet das Firefox-Addon Stylish welches ich bereits im Artikel WordPress 3.2: Arial im Backend ersetzen vorgestellt […]

Kommentare sind geschlossen.