Da ich immer schon meine Webseiten selber baute und es gewohnt bin, über jeden Pixel selbst zu herrschen, hatte ich Blogs lange ignoriert: Himmel, diese Standardoptik! Auch die vielen Themes zum Download machten das aus meiner Sicht nicht besser: ich will ALLES selbst gestalten und nirgendwo soll ein Duplikat zu finden sein.
Also machte ich mir dann die zunächst recht mühsame Arbeit, mein eigenes Design (z.B. vom Digital Diary, das vom Üblichen etwas abweicht) durch Veränderung der Standardtemplates hinzubekommen. Das funktionierte ganz gut, doch schleppe ich damit jede Menge unnötigen und verwirrenden Ballast in der CSS-Datei mit, durch den ich dann kaum noch selber durchblicke. So richtig kreativ werden (wie ich’s im MoMag versuchte) fällt auf diese Art auch schwer.
Mittlerweile fange ich also anders an, erschaffe zuerst ein fehlerfreies CSS-Layout und sehe DANN erst zu, wie ich das in ein („leeres“) WordPress-Theme einstricke. Im Rahmen dieses Lernprozesses fielen einige nützliche Links an, die ich hier mal weiter gebe (und auch gelegentlich aktualisiere):
Themes zur Inspiration:
Best of Weblog-Design: 30 individuell gestaltete Blogs, gesammelt vom Photoshop-Weblog. Leider sind es „nur“ internationale Blogs, diese zu präsentieren erschien dem Macher Dirk Metzmacher „neutraler“. In den Kommentaren wird übrigens zu Recht kritisiert, das die Designs oft mehr was fürs Auge bieten als für die Ergonomie bei der Nutzung. Aber das ist ja immer so: das Spektakuläre findet man erstmal toll, hundertmal drauf gucken und graue Schrift auf schwarzem Grund lesen, ist dann weniger schön – aber wer macht das schon?
Theme-Generator & Theme-Editor
- Der WordPress-Theme-Generator: netter Versuch, dem User ohne CSS/XHTML/PHP-Kenntnisse eine Möglichkeit zu geben, sich ein eigenes Theme „zusammen zu klicken“. Leider geht das nur in sehr engen Grenzen. Ich hab‘ mal versucht, das Modersohn-Magazin damit „nachzubauen“, doch auch wenn ich auf die Grenzen-sprengenden Außenmotive verzichte, komme ich der intendierten Optik nicht annähernd nahe. Ein solches Blog ist nicht wirklich „individuell“, kann es auch gar nicht sein, solange die Auswahl möglicher Menüs, Platzierungen und Proportionen so begrenzt ist. Update: Mittlerweile wurde der Theme-Generator mehrfach aktualisiert und erweitert. Die damit erstellten Themes sind auch WP 3.0-kompatibel.
- Artisteers Webdesign Revolution ist ein in ständiger Weiterentwicklung befindlicher WYSIWYG-Editor mit dem Anspruch, die Blog-Entwicklung auf das Niveau von Dreamweaver & Co. zu bringen. Ganz spannend, doch war die (ältere) Version, die ich getestet habe, doch sehr auf die Erschaffung „typischer Blogs“ ausgerichtet: immer wieder diese A4-Papier-Optik (mal mit runden Ecken, mal ohne) – schon meine jetzigen Kunden brauchen es auch mal anders. Auch erzeugt so ein Editor-Code zwangsläufig immer mal eine gewisse Menge überflüssigen Code – nichts für die, die gerne wissen, was unter der Haube los ist! Update: Mittlerweile ist das (kostenpflichtige) Programm auch WP3-kompatibel und exportiert auch Themes für Drupal, Joomla und andere CMS-Systeme.
CSS-Entwicklung
BlogPimp GridEasy von Lothar „BlogPimp“ Baier: ein CSS-Framework nicht nur fürs Blogdesign, das jede Menge wieder kehrende Arbeit abnimmt und die Entwicklung einer „Full CSS-Website“ deutlich vereinfacht. Um es für’s Blogdesign zu nutzen, muss man allerdings die im Blogscript möglichen Strukturen im Kopf haben.
Tutorials zur Entwicklung von WordPress-Templates
- CODEX auf WordPress.org – die (englischssprachige) Mutter aller Wissensquellen in Sachen Theme-Erstellung mit vielen Artikeln zu allem, was dazu gehört;
- Steffen-Tahlmann hat sein Tutorial „Eigenes WordPress-Theme erstellen“ mittlerweile zu einem richtigen „Handbuch“ mit vielen Kapiteln ausgebaut- klasse! Man lernt dabei die Struktur und das Funktionieren des WordPress-Codes kennen. Schritt für Schritt werden alle WordPress-typischen „Schnipsel-Dateien“ erläutert, bis ein schlichtes Basis-Theme steht, mit dem man gut weiter arbeiten kann. Um den Rest (Design, CSS, Grafik) musste man sich in der vorigen Fassung selber kümmern, in der aktuellen Version lernt man, das CSS Framework „Bluprint“ einzubinden und zu nutzen.
- WordPress-Themes Step by Step – ebenfalls ein sehr gutes Tutorial zur Erstellung eines zweispaltigen Themes unter Verwendung des YAML-Frameworks für die CSS-Styles. Autor ist Micha von DynamicInternet.
- SEO-Template für WordPress von STEREOPHONE zeigt, wie man ein Theme baut, das WordPress als CMS nutzt, also OHNE den ganzen Blog-Schnickschnack! Auch ohne Plugins und ohne händisch im Code rumschreiben zu müssen. Für optisch „ganz normale Webseiten“, die aber selber pflegbar sind, wie viele Kunden es ja heute wünschen.
- Auch Peruns ausführlicher Artikel WordPress als klassisches CMS – ein Beispiel zeigt, wie man WP als CMS für „normal aussehende“ Webseiten nutzen kann. Allerdings erläutert er das entlang am Code einer eigenen Seite – man muss also schon recht gute Kenntnisse rund um WP-Themes haben, um hier mitzukommen.
Mehr Nützliches für’s eigene WordPress-Theme
Und hier noch ein paar Fundsachen, die nicht fehlen dürfen:
- Für Theme-Entwickler: Mein nacktes, blankes WordPress-Theme (SHIFT Website Development Weblog) – Wenn man schon recht gut weiß, was man machen will, ist so etwas ein Segen! Zudem basiert dieses „nackte“ Theme auf dem neuen WordPress 3.x Standardtheme “2010″ – man läuft also nicht Gefahr, veraltete und mittlerweile „missbilligte“ Bestandteile zu nutzen.
- Wie man mittels Photoshop ein Blog-Layout erstellt, zeigt Schritt für Schritt das Tutorial „Create a modern Blog Layout“ auf psdvibe.com. Es geht allein um die Optik, wie man daraus dann ein Theme bastelt, wird NICHT vermittelt. Den gesamten Prozess zeigt das Tutorial „How To Create WordPress Themes From Scratch“ in einer dreiteiligen Serie – ebenfalls beginnend mit dem Photoshop-Layout. (leider alles auf schwarzem Background, für mich nicht grade Augen-schonend…)
…und eine Warnung
Vorsicht vor freien WordPress-Templates: Robert Basic zeigt mit seiner Warnung, warum der Wunsch nach Individualität nicht der einzige Grund ist, sich selber mit der Theme-Erstellung zu befassen.
Ich freue mich über weitere nützliche Quellen in den Kommentaren :-)
Diskussion
Kommentare abonnieren (RSS)
36 Kommentare zu „Blogdesign: Ein eigenes WordPress-Theme erstellen“.