seeseekey.net - Invictus Deus Ex Machina

Wenn man ein WordPress Theme entwickeln möchte, kann man natürlich von Null anfangen. Allerdings möchte man meist gleich mit der Idee beginnen und nicht erst stundenlang das entsprechende Grundgerüst erstellen. An dieser Stelle setzt das WordPress-Theme Bones an.

Die Feature Matrix von Bones

Dabei handelt es sich um ein sehr minimalistisches Theme, welches die Vorbereitungen für responsive und mobile Seiten beinhaltet. Auch die notwendige Abstraktion für die unterschiedlichsten Browser ist bereits erledigt worden. Heruntergeladen werden kann Bones dabei unter http://themble.com/bones/.

Nachdem ich in einer Multisite-Wordpress Installation das Theme gewechselt hatte, zeigte die entsprechende Seite sowohl im Front– als auch im Backend nur noch eine weiße Seite an. In den PHP Logmeldungen waren auch keine Probleme zu erkennen. Andere Seiten der Installation funktionierten weiterhin ohne Probleme.

Das alte Theme wurde entfernt

Bei einer Multisite-Installation deutet dies meist auf ein Problem mit dem verwendeten Theme hin. Zur Lösung sollte das aktivierte Theme über die Netzwerkverwaltung deinstalliert werden. Anschließend kann man sich wieder in das Backend der Seite einloggen und dort auf ein anderes Theme wechseln.

Das alte Design der Webseite war doch schon etwas angestaubt, was jemand mal so umschrieb:

Es hat mehr etwas von einem Outdoor Handy, als von einem iPhone, zweckmäßig halt.

Da mich sowieso einige Kleinigkeiten an dem Design störten, dachte ich mir das eine Renovierung ganz interessant wäre. Es stellte sich bloß die Frage ob man ein Theme komplett neu schreibt oder eine bereits vorhandene Basis nutzt.

Das alte Design „Ocean“

In meinem Fall überlegte ich auf Bootstrap oder der HTML Boilerplate aufzusetzen. Auch gibt es einige schöne WordPress „Starter Themes“, allerdings traf nichts wirklich meinen Nerv. Also ging die Suche weiter. Fündig wurde ich dann beim GPL Theme „Picochic“ (http://picomol.de/picochic/), welches mir doch recht gut gefiel. Dieses wurde als Grundlage genommen und daraus das neue Design gebaut welches man hier nun sehen kann.

Unter anderem mag ich feste Seitenbreiten nicht wirklich, was dann natürlich als erstes geändert werden musste. An der Typografie (Schriftarten etc.) wurde anschließend geschraubt, Stylesheets für den Druck wurden hinzugefügt und am Social Media Widget wurde gewerkelt, so das dieses nun auch Youtube unterstützt. Ansonsten wurden noch andere Dinge wie das Menü minimal angepasst. Jetzt müssen nur noch Fehler gefunden und beseitigt werden ;)

Wenn man mit der Entwicklung eines WordPress Themes anfängt, so sind es am Anfang immer die gleichen Sachen die man dort macht. Viel schöner wäre es wenn man gleich ein Grundgerüst hätte und dieses nur noch ausbauen muss. Genau für diesen Fall gibt es WP-Kickstart welches unter https://github.com/gerritvanaaken/WP-Kickstart zu finden ist. Lizenztechnisch steht das ganze unter Public Domain.

Weitere Informationen gibt es unter:
http://praegnanz.de/weblog/htmlcssjs-kickstart

Responsives Design ist schon eine tolle Sache. Je nach den Fähigkeiten des Ausgabegerätes wird die Webseite angepasst. Vor einigen Wochen habe ich mich auch daran gemacht und mein Design um eine reponsive Komponente erweitert. Das ganze sieht auf kleineren Geräten nun so aus:

Dabei wird per CSS geschaut ob eine bestimmte Mindestbreite unterschritten wird:

@media screen and (max-width: 850px)
{
 ...
}

Wenn das der Fall ist werden bestimmte Elemente (wie die Siderbar) ausgeblendet, die Größe der Schriftart verändert, et cetera. Nur gibt es anscheinend ein Problem mit ungeklärter Ursache. Wenn ich auf einem Mobilgerät die Seite „Blog“ aufrufe so ergibt sich folgendes Bild:

Er ignoriert anscheinend das angepasste CSS für Bildschirme kleiner 850 Pixel und zeigt stattdessen die „normale“ Seite an. Dies passiert auf allen getesteten Geräten und auch nur auf der Blog Seite. Nun zum Rätsel: Woher kommt das? Über Ideen zur Lösung des Problems würde ich mich freuen :)

Weitere Informationen gibt es unter:
http://www.elmastudio.de/webdesign/webseiten-optimierung-fur-mobile-gerate-verschiedene-losungen-im-vergleich/
http://www.elmastudio.de/webdesign/diskussionsanregung-wie-wichtig-ist-die-webseiten-optimierung-fur-mobile-gerate-heute-schon/

Das neue Standardtheme von WordPress ist ja Twenty Eleven. In der Blogseite hat man bei diesem Theme standardmäßig eine Sidebar. Nur bei den statischen Seiten war dies nicht der Fall. Damit auf diesen Seiten die Sidebar angezeigt wird, muss das Sidebar Template (Attribute -> Template) auf der Seite aktiviert werden. Damit ist die Sidebar dann auf der entsprechenden statischen Seite aktiviert.

Weitere Informationen gibt es unter:
http://www.transformationpowertools.com/wordpress/twenty-eleven-sidebar-on-single-posts-and-pages

Als ich an einem WordPress Theme baute, hatte ich das Problem das es die Absätze nicht richtig darstellte. Nach einiger Weile und dem stöbern in anderen Themes entdeckte ich das ein einfaches:

.entry p
{
    margin-bottom: 1em;
}

in der style.css diesen Umstand behebt. Danach werden die Absätze korrekt angezeigt.

Installiert man Firefox und Thunderbird unter KDE 4 so hat man optisch keine Freude an diesen Anwendungen. Damit sich das ändert sollte man ein passendes Theme installieren. Für den Firefox ist dies KFirefox welches unter http://ramonantonio.net/kde-firefox/ zu finden ist. Für den Thunderbird hört das Theme der Wahl auf den Namen OxyBird und ist unter https://addons.mozilla.org/de/thunderbird/addon/8344 zu finden.

Der Mediaplayer auf dem Neo hat am Anfang leider ein kleines Problem, ihm fehlt das Theme. Das ganze sieht dann so aus:

Das ist natürlich sehr unschön deshalb hier der Weg das Theme nachzuinstallieren:

opkg install openmoko-mediaplayer2
wget http://www.seeseekey.net/blog/uploads/files/openmoko/openmoko-mediaplayer-theme.tar.bz2
tar xjf openmoko-mediaplayer-theme.tar.bz2 –C /usr/share/themes/Moko/gtk-2.0
rm openmoko-mediaplayer-theme.tar.bz2

Was mir dabei noch aufgefallen ist das der Lautstärkeregler im Mediaplayer nicht funktioniert. Vielleicht weiß da ja jemand Rat:)