von Claudia Klinger, 24. Mai 2008, 11:32
Blogdesign: Ein eigenes Wordpress-Theme erstellen
10 Quellen des Wissens, besichtigt und kommentiert
Da ich immer schon meine Webseiten selber baute und es gewohnt war, über jeden Pixel selbst zu herrschen, hab’ ich Blogs lange ignoriert: Himmel, diese Standardoptik! Auch die vielen Themes zum Download, die dann erschienen, 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) 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.
Neuerdings 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. Der Lernprozess ist noch im Gange, dabei fallen einige nützliche Links an, die ich hier mal weiter gebe:
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. (via XSBlog2).
- Artisteers Webdesign Revolution ist ein noch in Entwicklung befindlicher WYSIWYG-Editor, der die Blog-Entwicklung wie die Vorschau ahnen lässt auf das Niveau von Dreamweaver & Co. bringen will. Ganz spannend, doch wie es aussieht ist zumindest die erste Version 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.
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;
- Tutorial zum Bau eines eigenen Wordpress-Templates: Steffen-Tahlmann bringt das auf einer übersichtlichen Blog-Seite fertig - klasse! Man lernt dabei die Struktur und das Funktionieren des Wordpress-Codes kennen; Um den Rest (Design, CSS, Grafik) muss man sich selber kümmern. Dass es das tolle Tutorial noch gibt, verdanken wir Christian Strang vom Webdesignblog.
- 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: 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.
- Ein weiteres Tutorial zum eigenen Theme gibts auch auf Webworkblog.net. Es wirkt auf mich nicht so ganz leicht verständlich (z.B. chaotisch dargestellter Code) und verliert nicht viele Worte zu den einzelnen Schritten. Kommt mir vor, als hätte der Autor grade mal seinen eigenen Weg zum (sehr schlichten) Theme beschrieben, um daraus ‘gefragten Content’ zu machen. Für ein WEBWORK-Blog zu dünn!
…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 :-)
...oder abonniere den Newsfeed.
Am 25. Mai 2008 um 23:16 Uhr
Vielen Dank für den Artikel. Ein paar der Links kannte ich schon, andere noch nicht, ich werde mich nun mal überall schlau lesen :) Ich beschreite gerade einen ähnlichen Lern- und Leidensweg: zwei Themes habe ich auf Grundlage eines Default-Themes entwickelt, frage mich aber immer noch so manches Mal, was um Himmels willen die eine oder andere Code-Zeile soll, ob sie gebraucht wird oder nicht.
Nun habe ich die Blanko-Vorlage von texto.de entdeckt, die meinem Verständnis (ich verstehe PHP nur rudimentär) enorm voran geholfen hat.
CSS pflegeleicht, übersichtlich und ohne Browserkompatibilitätsproblemen gibts mit dem YAML-Framework (www.yaml.de), das ich höchst empfehlenswert finde, aber ein wenig Einarbeitungszeit erfordert. Dafür kann man es dann aber auch für alle Projekte einsetzen.
Am 10. Juni 2008 um 09:08 Uhr
[...] Passagen deutlich hervorheben und durch ein paar Unterüberschriften ergänzen. Danke nochmals Claudia für das freundliche und vor allem konstruktive Feedback [...]
Am 12. Juni 2008 um 09:15 Uhr
[...] es auch fast immer dazu, das jeweilige Webdesign in ein Blogskript einzupfriemeln (”Theme erstellen“), ohne das kaum mehr eine “ordentliche Website” auskommt - auch wenn sie gar [...]
Am 8. September 2008 um 11:25 Uhr
[...] sein. Nur wie beginnt man mit so einer großen Aufgabe, die suche bei Google liefert Blogeinträge die sich die selbe Frage stellen. Dann Findet man auch einen Theme Generator für Wordpress, [...]
Am 17. September 2008 um 16:07 Uhr
Bin in allen Punkten mit dir einer Meinung… zum Ausprobieren sind freie Templates ja okay, aber wer längerfristig bloggen will, sollte auch optisch für “Uniqueness” sorgen. Sehr gute Erfahrung bei der Entwicklung eigener Templates habe ich übrigens mit “YAML” (yet another multicolumn layout) gemacht.
Am 21. Dezember 2008 um 22:21 Uhr
Hallo!
Vielen Dank für die vielen Links und
die sehr nützlichen Erklärungen, demnächst
möchte ich mich mit Wordpress beschäftigen
hatte bisher noch keine Zeit dafür.
gr Robby
Am 3. Januar 2009 um 17:45 Uhr
Das schön am layouten eines Wordpress Templates ist, dass man nicht lange grübbeln muss was alles reinmuss, wie das wireframe auszusehen hat, etc. denn die hauptblöcke “Content, Sidebar, Logo” sind ja eigentlich immer recht gleich, denn das wichtigste an einem Blog ist eben der Content und der nimmt einen Großteil an Platz ein (sollte es zumindest).
Habe deinen Artikel gerade mal gebookmarked, werde sicherlich in nächster Zeit selbst wieder ein Template basteln und dafür ist diese Linksammlung wirklich sehr schön!
Am 11. Januar 2009 um 00:01 Uhr
[...] Blogdesign: Ein eigenes Wordpress-Theme erstellen Auf Templatr findet sich eine Art “Web 2.0 Theme-Generator”. Die Funktionen sind natürlich etwas eingeschränkt, jedoch ist dies für den Anfang sicher nicht schlecht. Auf dieser Seite finden sich noch einige Zusatz-Informationen soweit ich weiss. [...]
Am 5. Februar 2009 um 00:43 Uhr
Gute Übersicht!
Am 7. Februar 2009 um 21:16 Uhr
Klasse Beitrag mit super Links. Die meisten kannte ich bisher nicht. Macht das Individualisieren einfacher!
Am 25. Mai 2009 um 12:27 Uhr
black cyber-shot t200 digital still cameraanddigital cameras raw formatand17-22 samsung digital cameraandcamera digital dscp10 sony ukandhow to paint aluminum pool deckandhow to hack a mmoandhow to write a commentaryand
Am 8. Juni 2009 um 19:11 Uhr
Super Links, ich habe jedoch wenn ich mir ein eigenes Template gebaut habe immer ein schlichtes oder fast leeres Template genommen und das dann erweitert bzw. nach meinen Wünschen umgebaut. Ist zwar dann nichts komplett eigenes aber mir hatte das bisher immer gereicht.
Am 3. Juli 2009 um 19:32 Uhr
[...] man richtig GUTE Blogpostings schreibt… Der Schocker Blogger » Reichtum & Geld verdienen Blogdesign: Ein eigenes Wordpress-Theme erstellen Eigenes WordPress-Template Webdesignblog Der Schocker [...]
Am 1. Januar 2010 um 19:53 Uhr
Sehr interssanter Artikel, hat mir wirklich sehr gut gefallen. Konnte einiges lernen. Danke
Am 14. Januar 2010 um 09:24 Uhr
vielen dank für die Infos..!!!!!
Am 19. Januar 2010 um 18:09 Uhr
Ja die infos kommen auf jeden fall gut an..
und sind sehr informationsreich..
gut erklärt..
thx Jones
Am 2. Mai 2010 um 19:34 Uhr
Mit den Theme Editoren/Generatoren kann ich zwar eher wenig anfangen, die Tutorials hingegen liefern doch echt gute Tipps - danke dafür!
Am 20. Juni 2010 um 22:18 Uhr
[...] http://www.webwriting-magazin.de/blogdesign-ein-eigenes-wordpress-theme-erstellen/ [...]
Am 21. Juni 2010 um 11:10 Uhr
Ich danke für die nützliche Information!
Am 30. August 2010 um 23:22 Uhr
Danke für die Infos !
Super Beitrag