Archive Webdesign
Bibra-OnlineWebdesignWordpress
3. September 2010

Im Sommer ist endlich WordPress 3.0 erschienen und hat seit 2.8 hauptsächlich Verbesserungen und Bugfixes unter der Haube mitgebracht. Im Frühjahr hatte ich schon einmal einen Artikel über kleine Optimierungsmöglichkeiten geschrieben, den ich mit diesem Posting noch einmal zusammenfassen möchte. Konkret ging es dabei um die Einstellung anderer Bildschirm-Zeichensätze im HTML- und Visual-Editor und der Verkleinerung von störenden Buttons, die man mit folgenden Tricks bewerkstelligen kann:

HTML-Editor: In der Datei wp-admin/css/wp-admin.css der CSS-Definition #editorcontainer #content folgenden Code hinzufügen: font-family: Consolas, “Courier New”; (oder einen anderen gewünschen Zeichensatz eintragen). Die Zeilenhöhe kann in der Definition line-height: 150%; auf ca. 110% reduziert werden.

Visual Editor: Hier muß eine Zeile in der Datei wp-includes\js\tinymce\themes\advanced\skins\wp_theme\content.css geändert werden. Sie befindet sich in der CSS-Definition SS-Definition body.mceContentBody und lautet font: 13px/19px Georgia, “Times New Roman”, “Bitstream Charter”, Times, serif; – dort kann man stattdessen z.B. den Zeichensatz eintragen, der auch im Blog-Template verwendet wird.

Zwei weitere Modifikationen sind interessant, wenn man wenig Platz auf dem Bildschirm hat und zwei zusätzliche Buttons zum Umbruch der Permalink-Zeile führen:

Get Shortlink: Am Ende der Zeile 249 der Datei /wp-admin/edit-form-advanced.php kann man die Beschriftung des Buttons von (‘Get Shortlink’) auf einen kürzeren Text ändern – ganz entfernen kann man den Knopf leider nicht.

View Post: In Zeile 1096 der Datei /wp-admin/includes/post.php kann man die Beschriftung View Post auf einen kürzeren Text ändern. Damit sollte auch bei Auflösungen von 1024 Pixeln Breite genug Platz für die eigentlich unnötigen Buttons sein.

Diese vier Änderungen gehen natürlich nach einem Upgrade wieder verloren, so daß man die Dateien vorher sichern sollte. Beim Upgrade von 2.8 auf 3.0 muß man die Änderungen unbedingt per Hand in die neuen Versionen der Dateien eintragen, da sich einiges am Code geändert hat.

Ansonsten gibt es über WordPress 3.0 eigentlich nur zu berichten, daß es wunderbar funktioniert – sogar die fünf Jahre alte Datenbank von DVDLog.de hat das Upgrade problemlos ausgehalten. Wenn es nur endlich mal eine Möglichkeit der Zeichensatz-Einstellung für die Editoren und das Entfernen von unnötigen Knöpfen geben würde…

DVDLogFotoWebdesignWordpress
30. August 2010

So langsam komme ich wieder in einen einigermaßen vernünftigen Arbeitsrhythmus für die Webseiten hinein, aber bis jetzt habe ich es nur geschafft, DVDLog wieder etwas auf Trab zu bringen. Außer der DVD-Kritik von Carl Sagan’s Cosmos ging es um das 3D-Spektakel von ARTE, das praktisch ein Schuß in den Ofen war: der Sender, der gerne mit seinem HD-Kanal protzt, hatte für den in einer Cross-Promotion mit der Bild-Zeitung(!) beworbenen 3D-Tag nur mieserable, nach VHS-Kassetten aussehende Bildmaster von Dial M for Murder und Creature of the Black Lagoon gesendet. Da war ich ganz froh, daß ich davon erst spät erfahren und nichts großartig angekündigt hatte – denn es braucht schon mehr als Alfred Hitchcock und dem Kiemenmann 3D-Brillen aufzusetzen, um Filmfans hinter dem Ofen hervorzulocken.

Aber erstmal genug geschimpft! Zu anderen Sachen bin ich leider jetzt noch nicht gekommen, wie zum Beispiel endlich mal neue Bilder für die Foto-Webseite rauszusuchen – genug Material ist da, aber das muß ich erstmal in Ruhe sichten. In den nächsten Tagen werde ich aber endlich einen neuen Artikel über WordPress 3.0 schreiben – ehrlich! Bis dahin bitte ich noch um etwas Geduld :-).

DVDLogWebdesignWordpress
24. June 2010

Eigentlich hatte ich richtig Lust, mal wieder eine ausgewachsene Review zu schreiben, aber nach der Enttäuschung über die vermurkste britische DVD von African Queen war mir einfach nicht mehr danach und ich hatte nur noch eine Kurzkritik fürs DVDLog geschrieben. Wer hätte auch damit gerechnet, daß jemand das 1.37:1-Bild mit fetten schwarzen Balken an den Seiten in 16:9 codieren und damit ein Drittel Auflösung verschenken würde?

ITV hat das mit African Queen ernsthaft geschafft und damit die Special Restoration Edition zu einem praktisch wertlosen Untersetzer gemacht, den ich aus Frust als defekt nach England zurückgeschickt habe. Irgendwann, wenn der Euro-Kurs wieder etwas erträglicher ist, werde ich mir wohl dann doch mal die amerikanische DVD zulegen müssen, auch wenn dort der Audiokommentar von Jack Cardiff fehlt. Ein bißchen Hoffnung auf eine neu gemasterte britische DVD habe ich noch, aber ob meine Review, die Emails an ITV und eine negative Amazon-Bewertung ausreichen, weiß ich wirklich nicht.

Tja, was war sonst noch? Ach ja, WordPress 3.0 ist erschienen und meine Webseiten haben das Upgrade ohne größere Probleme vertragen. Allerdings funktionieren die Tricks, die ich hier und hier gepostet hatte, nicht mehr so einfach [Edit: klappen doch noch!] – mehr dazu demnächst in einem eigenen Posting irgendwann im Laufe der nächsten Woche.

DVDLogWebdesign
27. March 2010

So, Microsoft, das war’s dann. Laut einem Artikel im PC-Magazine soll der gerade in einer rudimentären technischen Demo vorgestellte Internet Explorer 9 nicht mehr unter Windows XP funktionieren – es muß mindestens Vista sein, am liebsten Windows 7. Das ist nicht nur ein Schlag ins Gesicht von Benutzern älterer Computer, sondern auch der Webdesigner, die nun gezwungen sind, sich einen Rechner mit dem neuesten Microsoft-Betriebssystem ins Arbeitszimmer zu stellen oder zumindest eine aufwendige und langsame Installation in einer VM zu benutzen.

Deswegen ist zumindest für mich jetzt entgültig das Ende der Fahnenstange erreicht: ich werde in Zukunft auf meinen eigenen Webseiten nicht mehr darauf achten, ob die Seiten mit dem Internet Explorer kompatibel sind. Ich werde allerhöchstens noch prüfen, ob IE7 und IE8 alles einigermaßen korrekt darstellen, aber Extrawürste im Layout werde ich jetzt nicht mehr braten. Was meine externen Webdesign-Projekte angeht, werde ich natürlich auf Wunsch weiterhin eine Abwärts-Kompatiblität bis zum IE6 anbieten, wenn auch aus technischen Gründen mit Einschränkungen.

Rehabilitiert hat sich aber inzwischen Opera, in dessen Version 10.50 wirklich kräftig der Wurm drin war. Am Montag wurde aber die Version 10.51 veröffentlicht, die nicht nur die gefährliche Sicherheitslücke schließt, sondern auch die größten Probleme der Vorversion erledigt. Zum Beispiel werden die Bookmarks jetzt wieder sofort geladen und die HTML-Rendering-Probleme sind offenbar auch alle beseitigt worden. Außerdem ist die neue Version wieder ein ganzes Stück schneller geworden, im Vergleich zum Firefox bekommt man einen richtigen Geschwindigkeitsrausch. Es ist also alles wieder im Lot mit Opera, die 10.50 war wohl wirklich nur ein verzeihbarer Ausrutscher.

Und noch etwas in eigener Sache: drüben im DVDLog gibts diese Woche keine neue Review, die nächste wird vorraussichtlich am Ostersonntag oder Ostermontag kommen – wahrscheinlich erstmal noch etwas renoviertes aus dem Archiv. Bis dann! :)

WebdesignWordpress
5. February 2010

WordPress ist spätestens seit der letzten Modernisierung des Backends ab Version 2.7 zu einem richtig professionellen Web-Publishing-Tool geworden und viel mehr als nur ein einfaches Blogsystem, sondern ein richtiges CMS. Allerdings hat WordPress auch eine Schwachstelle, die jeden schon einmal geärgert haben dürfte, der viel HTML-Quellcode bearbeiten muß: der Editor, oder besser gesagt, die Editoren.

Als Visual Editor ist in WordPress standardmäßig TinyMCE eingebaut, der zwar für die gelegentliche Benutzung ganz okay ist, aber öfter schonmal ziemliches HTML-Kuddelmuddel produziert und für ordentliche Textformatierung kaum zu gebrauchen ist. Der HTML-Editor ist dagegen lediglich ein simples Textfeld, aber beide Editoren haben eine ärgerliche Gemeinsamkeit: mit Bordmitteln lassen sich die standardmäßig eingestellten Fonts nicht ändern – kleine Basteleien in den CSS-Dateien von WordPress macht das aber trotzdem möglich.

Um den Font des HTML-Editors zu ändern, muß man in der Datei wp-admin/wp-admin.css unter der CSS-Definition #editorcontainer #content folgenden Code einfügen: font-family: Consolas, “Courier New”; (oder einen anderen gewünschen Zeichensatz eintragen). Dazu empfiehlt sich auch noch die Zeilenhöhe in der Zeile line-height: 150%; auf einen Wert von 110% zu reduzieren.

Beim Visual Editor muß man sogar nur eine Zeile abändern, die sich in der Datei wp-includes\js\tinymce\themes\advanced\skins\wp_theme\content.css versteckt. Die CSS-Definition body.mceContentBody ist für den Editor-Zeichensatz zuständig und lautet ursprünglich font: 13px/19px Georgia, “Times New Roman”, “Bitstream Charter”, Times, serif;. Stattdessen kann man sich denjenigen Zeichensatz aussuchen, den man auch im Blog-Template verwendet – Verdana, Arial, Trebuchet MS oder Lucida Grande, je nach Geschmack.

Natürlich gehen die Änderungen nach einem Upgrade wieder verloren, weil die Dateien überschrieben werden – entweder muß man die Anpassungen noch einmal vornehmen oder ein Backup zurückspielen. Bei der CSS-Datei des HTML-Editors sollte man aber bei einem Upgrade keine ältere Version nehmen, da die Datei für einen großen Teil des Backends zuständig ist und sich schneller etwas ändern kann als beim TinyMCE.

Soweit also zum Thema WordPress-Editoren – es wird Zeit, daß so eine simple Funktion endlich mal zu den Einstellungen hinzugefügt wird.

Webdesign
13. January 2010

Ich liebe WordPress ja über alles, aber manchmal geht mir der Feature-Wahnsinn doch etwas auf den Senkel. Vor ein paar Tagen hatte ich endlich alle drei Installationen auf die neue Version 2.9.1 upgedatet, aber im Editor tauchte plötzlich neben der Zeile mit dem Permalink ein neuer Knopf namens Get Shortlink auf, mit dem man Kurz-URLs des neuen WordPress-Dients WP.ME generieren kann. Finde ich ja ganz nett, aber 1.) brauche ich sowas nicht und 2.) ist der Knopf auf dem kleinen 1024×768-Screen meines Arbeits-Notebooks so riesig, daß er bei langen Permalinks auf die nächste Zeile umbricht und so wertvollen Bildschirm-Platz wegnimmt. Ärgerliche Sache, wie kriegt man das Ding da weg?

Als erstes habe ich mal eine Volltextsuche über meine lokale WordPress-Installation gemacht, um herauszukriegen in welcher Datei der Übeltäter untergebracht ist. Aber ich konnte nichts finden – und meine lokalen Installationen hatten diesen Button gar nicht, obwohl dort auch Version 2.9.1 lief. Auch die Web-Mirrors waren davon nicht betroffen. Was ist da los? Etwas Buddelei im Web förderte dann die Antwort zutage: der Button wird von dem WordPress-Statistik-Plugin eingefügt, das ich bei den lokalen Installationen deaktiviert und bei den Mirrors noch nicht upgedatet hatte! Und damit war auch eine Angriffs-Stelle gefunden, mit der ich den lästigen Knopf bearbeiten konnte.

Ich habe mich nicht getraut, den Button ganz aus dem Code zu entfernen, weil ich die Statistiken mag und nichts kaputtmachen wollte. Wer sich aber auch über den zusätzlichen Button ärgert, der kann es genauso wie ich machen und in Zeile 1064 der Datei /wp-content/plugins/stats/stats.php den String (‘Get Shortlink’) in (‘GSL’) oder in noch etwas kürzeres ändern. Problem erledigt, nur muß man das bei jedem Plugin-Update nochmal machen, da die geänderte Datei ja wieder mit der offiziellen Version überschrieben wird. Besser wärs natürlich, wenn man in den Screen Options oder der allgemeinen Konfiguration den Knopf ausschalten könnte!

WordPress ist in den letzten Jahren schon toll geworden, aber ein paar Sachen finde ich immer noch nicht so gut. Zwar ist das Admin-Interface inzwischen richtig modern und praktisch geworden, aber ich warte immer noch auf eine Möglichkeit, im HTML-Editor einen eigenen Zeichensatz einstellen zu können oder aufs Syntax-Highlighting. Aber wenn sich die WordPress-Programmierer mit so unwichtigen Dingen wie Kurz-URLs aufhalten, kann man da noch lange drauf warten…

Bibra-OnlineDVDLogFotoWebdesign
11. August 2009

Da war er wieder, der Browser-Kompatiblitäts-Fluch. Vor kurzem hatte ich drüben auf der Foto-Webseite das Header-Menü neu gestaltet, aber ich habe erst jetzt gemerkt, daß die neuen Icons im Firefox und Internet Explorer horizontal falsch positioniert waren. Natürlich hatte ich die Änderungen wieder nur im Opera geprüft, wo es genauso aussah, wie ich es haben wollte – nur die anderen Browser haben mal wieder gesponnen. Jetzt habe ich das Ganze notdürftig geflickt, so daß es zumindest im Firefox und IE gut aussieht und die Icons nur im Opera ganz leicht falsch stehen. Irgendwann muß ich den ganzen Header nochmal neu mit DIV-Blöcken neu aufbauen, und dann werde ich das Design technisch von vorneherein besser machen. Vorerst bleibt es aber erstmal bei dieser Zwischenlösung, die ja auch ganz gut funktioniert.

Außerdem habe ich genauso wie hier auf Bibra-Online.de die rechte Sidebar der Foto-Webseite mit einer Anzeige der letzten Blog-Artikel ausgestattet, nachdem in der letzten Zeit immer sehr viele User direkt über einzelne Postings auf die Webseite gekommen sind – vielleicht hilft das ja, auch den Rest des Fotoarchivs etwas populärer zu machen. Verwendet habe ich dazu übrigens das Plugin Customizable Post Listings von Scott Reilly, dessen Formatierungs-Optionen zur Anzeige von Posting-Titeln eine große Erleichterung sind.

Auf der Suche nach einer Methode, die Posting-Titel bei der Anzeige in Sidebars oder ähnlichen Elementen mit fixer Breite automatisch zu kürzen um unschöne Umbrüche zu vermeiden, bin ich auf -zig verschiedene Hinweise gestoßen, bis ich gemerkt habe, daß ausgerechnet das Plugin, was ich sowieso schon einsetze, diese Möglichkeit bietet. Einfach beim Aufruf von Customizable Post Listings das Substitution-Tag %post_URL_short% verwenden und im Admin-Bereich die maximale Anzahl von Buchstaben angeben, die man anzeigen möchte – dazu kein ist kein weiterer PHP-Code nötig. Hier auf Bibra-Online.de habe ich das noch nicht aktiviert, aber auf der Foto-Webseite hat sich das bei den langen Posting-Titeln als sehr nützlich erwiesen.

Zum Schluß vielleicht noch ein Hinweis zum Zeitplan: spätestens nächste Woche Montag eine neue DVD-Kritik im DVDLog und vielleicht finde ich demnächst auch endlich Zeit und Energie, die restlichen Amsel-Videos für die Foto-Webseite zu schneiden und zu konvertieren. Die drei jungen Amseln hüpfen und flattern übrigens immer noch gesund und munter über die Wiesen in der Nähe von unseren Balkons!