Statistiken

308 Artikel

1278 Kommentare

9947 Besucher diesen Monat

114 visitor(s) today

Links

Creative Commons License - Some Rights Reserved

Friday, 31. August 2007

Bulletproof Theme in Serendipity 1.2

Nachdem Robert so begeistert über das neue Bulletproof Theme war, das mit der neuen Serendipity Version 1.2 ausgeliefert wurde, und alle Welt im Moment offenbar nun seine Templates umstellt, habe ich mir das Theme nun auch einmal angesehen.

Wow, das ist echt schick geworden! Bulletproof könnte man als Meta-Theme bezeichnen. Es wird mit 4 unterschiedlichen Farbauswahlen (CSS Dateien) ausgeliefert, was erst einmal nicht besonderes ist, das gab es vorher in anderen Themes auch schon. Allerdings ist es zusätzlich noch weitreichend über die Konfiguration des Themes anpassbar, was jedem die Möglichkeit gibt, die 4 Farbauswahlen jeweils nach seinem Geschmack zu layouten.

Die Konfiguration umfasst solche Sachen wie ein eigenes Header Bild, eine Angabe, wo die Blog Navigation sein soll (über/unter dem Header, zusätzlich in der Fußleiste usw), wie die Spalten angeordnet werden sollen, welche Teile im Artikel Footer erscheinen sollen und natürlich Standards wie die Konfiguration, welche Einträge die Blognavigation eigentlich haben soll. Zusätzlich kann man noch Counter Codes einfügen (z.B. von MyBlogLog und ähnlichen Services) und freien Inhalt in den Footer packen. Wohlgemerkt: All das funktioniert ohne jeglichen Eingriff in die Template Dateien, die Layout Änderungen sind über eine übersichtliche Konfiguration einfach einstellbar! Das ist ziemlich komfortabel, denn so können auch Anwender, die von Templates und CSS keine Ahnung haben, schon sehr gute Resultate nach eigenem Geschmack zusammen klicken.

Ich bin natürlich gleich einen Schritt weiter gegangen und habe mein eigenes Set an CSS Dateien und Bildern erstellt. Bei den mitgelieferten Template Versionen kann man nur Farben global auswählen und es war keine dabei, die zu meinem Blog passte. Wenn man Farben anpassen will, muss man sich also sein eigenes Set erzeugen. Ich habe das violette Thema nun als Grundlage genommen und daraus ein graues Thema erzeugt, das ich noch ein wenig erweitert habe z.B. mit Linkicons usw. Das graue Thema habe ich ungefähr so gestyled, wie mein Blog vorher aussah. Allerdings komme ich nun z.B. in den Genuss von 2 Spalten neben den Artikeln, was ich immer schon einmal haben wollte.

Was mir auch noch fehlte, war die Möglichkeit, sein neues Set von CSS Dateien und Bildern auf einfache Weise in das Bulletproof Theme einzupflegen. Die CSS Dateien, die ausgewählt werden können, sind in der Theme Konfiguration hart kodiert. Wenn man also eine neue Farbauswahl zusammen stellt, muss man den Code der Theme Konfiguration anpassen. Ich wünsche mir hier eher einen Mechanismus, der bewirkt, dass man sein Set einfach in das BP Verzeichnis ablegen kann und das Theme diese Dateien erkennt und mit den bereits vorhandenen Farbversionen zur Auswahl anbietet. Ich habe das im S9Y Forum angemerkt. Garvin fand die Idee so schick, dass er das gleich implementiert hat.

Da man nun einiges "nebenbei" umkonfigurieren kann, werde ich wahrscheinlich noch ein wenig mit dem Layout herum experimentieren. Wie gefällt es euch?

in Serendipity | 14 Comments | No Trackbacks

Defined tags for this entry: s9y, Template

Related entries by tags:

1246 hits

Trackbacks

Trackback specific URI for this entry

No Trackbacks

Comments

Display comments as (Linear | Threaded)

YellowLed

Homepage

08/31/2007 09:41AM

Hübsch, ich hoffe, die Umsetzung war so simpel und zügig gemacht, wie es mit Bulletproof sein sollte? Die mitgelieferten Farbsets sind natürlich z.T. »proof of concept«. Da wird vieles gezeigt, was möglich ist, aber es ging nicht unbedingt darum, einen Designblumentopf zu gewinnen. Die laufen mehr so nach dem Motto »Wenn es jemandem gefällt, schön. Wenn nicht: Anpassen.«

Grischa

Homepage

08/31/2007 01:36PM

Ja, es war doch relativ einfach. Vor allem das Konvertieren eines alten Templates in das Bulletproof ging locker von der Hand, habe mir aber ein wenig Zeit dafür genommen, um nicht einfach alle meine alten Klassen zu nehmen, sondern nur die wirklich noch benötigten Änderungen. Jetzt muss ich nur noch schauen, dass das Theme auch noch ein wenig kompatibler mit IE wird. Die Tagcloud sieht im IE z.B. echt bescheiden aus, da fehlen die meisten RSS Icons. Auch das Icon für externe Links sieht man im IE nur manchmal, das war mit meinem alten Theme aber schon ähnlich. Ich habe noch keine Ahnung, warum das nicht richtig klappt. Da ist es natürlich schön, dass ihr besondere CSS Dateien für die einzelnen Browser habt, die kann man dann wahrscheinlich gut dafür benutzen. Die mitgelieferten Farbauswahlen sind aber doch schon recht nett? Ein Starter wird da schon etwas nettes dabei finden. Euer Theme ist wirklich klasse geworden, vielen Dank! Ach - was ich in meinem Artikel noch vergessen habe: Die Admin Oberfläche wird mit dem Theme auch noch richtig schön und übersichtlich. Das gefiel mir auch sehr gut! Daumen hoch!

#1.1

YellowLed

Homepage

08/31/2007 02:08PM

Hmmm. Nun sitze ich hier mal wieder an einem Linux-Desktop und habe folglich keinen IE zur Hand, insofern kann ich nix prüfen. Reden wir möglicherweise von einem IE6? Dann liegt es vermutlich an dessen grottiger bzw. praktisch nicht vorhandener PNG-Unterstützung (so ziemlich alle Grafiken in BP sind PNGs). Es wäre ggf. einen Versuch wert, das Browser Compatibility-Plugin zu testen (macht aber meiner Erfahrung nach mehr Ärger, als dass es nützt) oder aber ggf. die betreffenden Grafiken durch GIFs zu ersetzen und das im Stylesheet anzupassen. Eventuell wäre es auch möglich (das müsste man mal für kuhzünftige BP-Versionen prüfen), gewisse PNG-Icons für IE6 durch GIFs zu ersetzen ... zumindest beim XML-Icon müsste das gehen. Hmhmhm. Mal sehen

#1.1.1

Grischa

Homepage

08/31/2007 02:42PM

Nein, es ist ein IE7. Wenn ich allerdings weiß, dass PNG nicht so gut unterstützt wird, dann ändere ich meine Icons wohl mal auf GIF. Ich habe es jetzt aber wohl heraus gefunden, warum IE die XML Icons in der Tagwolke nicht anzeigt: Ich hatte das Padding aus der serendipity_xml_icon Klasse entfernt, weil die beim purple colorset falsch war (padding oben und unten, was ziemlich schlimm aussah, weil die Icons so die Schriften überschrieben). Nun habe ich wieder ein Padding drin, allerdings rechts und links, nun stellt der IE7 wieder alle XML Icons bis auf eines (?!) dar.

#1.1.1.1

Matthias

Homepage

08/31/2007 08:06PM

Die alte Plage IE, ich habe da auch immer mal wieder Probleme mit irgendwelchen Icons. Glaube aber nicht, dass es im IE7 noch an PNGs liegt. Ich habe seit einiger Zeit ein fast fertiges Layout auf Halde liegen, vielleicht gehe ich da auch nochmal ran und ziehe es auf Bulletproof rüber ... ich glaube, ich werde es nicht bereuen.

#1.1.1.1.1

Grischa

Homepage

08/31/2007 10:37PM

Ich glaube auch nicht, dass Du es bereuen wirst. Die Portierung ist wie geschrieben relativ einfach. Und die Möglichkeiten nachher mal eben Spalten per Konfiguration zu verschieben usw. empfand ich wirklich als sehr komfortabel. Bin immer noch nicht sicher, ob ich meine dünne Spalte links lasse oder rechts neben die andere Spalte stelle. Ist mit BP eben kein Problem, einfach die Option in der Theme Konfiguration ändern.

#1.1.1.1.1.1

YellowLed

Homepage

08/31/2007 08:59PM

Meines Wissens hat IE7 keine Probleme mit PNGs mehr. Falls Du das bereits erwähnte Kompatibilitäts-Plugin benutzt, würde ich das mal testweise abklemmen. Ich bin eigentlich kein Fan von GIFs, aber wir können ja mal überlegen, in einer kuhzünftigen BP-Version dem IE da eine Extrawurst zu braten. Allerdings gibt's ja mittlerweile andere Baustellen ...

#1.1.1.1.2

Grischa

Homepage

08/31/2007 10:34PM

Warum bist Du eigentlich kein Freund von GIF? Wegen dem alten Lizenzproblem? Das ist doch inzwischen nicht mehr vorhanden, oder?

#1.1.1.1.2.1

YellowLed

Homepage

08/31/2007 10:51PM

Ursprünglich schon, wobei ich zugeben muss, dass mein letzter Stand in Sachen Lizenz schon etwas veraltet ist. Scheinbar ist das in der Tat kein Problem mehr, aber: IANAL. PNG hat weitere Vorteile (z.B. verlustfreie Kompression) - ich persönlich schätze daran vor allem, dass ich in Gimp (Sponsort mir jemand Photoshop? Nein?

) leichter mit PNGs arbeiten kann. Und ehrlich gesagt kratzen mich IE6-Nutzer nicht sonderlich

Grundsätzlich ist für den ganzen Grafikkram in BP ohnehin eher David zuständig, und obwohl ich mich gerade nicht an die Gründe erinnere, war auch David eher für PNG. Aber ich stelle die GIF-Geschichte mal zur internen Diskussion.

#1.1.1.1.2.1.1

Grischa

Homepage

09/01/2007 04:34AM

IANAL? Was ist das denn schon wieder für eine Schweinerei?

Dass PNG verlustfrei komprimiert, wusste ich noch gar nicht! Das spricht dann natürlich deutlich für PNG und gegen IE6!

Danke für die Info! Und wieso kann Gimp mit PNG besser arbeiten als z.B. mit GIF? Ich erkenne da nicht wirklich einen Unterschied, wenn ich die beiden Formate benutze? Ich verwende nämlich auch Gimp..

#1.1.1.1.2.1.1.1

YellowLed

Homepage

09/01/2007 02:32PM

http://catb.org/jargon/html/I/IANAL.html

Zur verlustfreien Kompression lese ich gerade, GIF biete das auch. Vermutlich wie bei mp3-Dateien letztlich eine Frage der Einstellungen, keine Ahnung. Und zu Gimp: Wenn ich eine bereits als GIF gespeicherte Datei z.B. einfärben will, muss ich sie zunächst in dem RGB-Modus versetzen. Dieser Schritt entfällt bei PNG.

#1.1.1.1.2.1.1.1.1

Grischa

Homepage

09/01/2007 02:36PM

IANAL: Uiuiui.. Das ist bestimmt eine total verbreitete Abkürzung, oder?

GIF verlustfrei: Kann man das auch beim Speichern aus GIMP einstellen? Muss ich mal schauen, wie die Dateigrößen im Vergleich sind. Danke schon mal für die Hinweise!

#1.1.1.1.2.1.1.1.1.1

YellowLed

Homepage

09/02/2007 12:02PM

Das weiß ich nicht - ich benutze ja nie GIF

Gerade gestestet: Direkt beim Speichern einer Datei kann man bei GIF gar nix angeben ... möglicherweise versteckt sich das irgendwo in den Gimp-Einstellungen, ich war gerade zu faul zum Suchen

#1.1.1.1.2.1.1.1.1.1.1

Grischa

Homepage

09/02/2007 12:51PM

Ist auch nicht so wichtig.

Danke!

#1.1.1.1.2.1.1.1.1.1.1.1

Add Comment

Name
Email
Homepage
In reply to
Comment: Twitter/Identica/Pavatar/Gravatar/Favatar/Wavatars author images supported.
E-Mail addresses will not be displayed and will only be used for E-Mail notifications.

To prevent automated Bots from commentspamming, please enter the string you see in the image below in the appropriate input box. Your comment will only be submitted if the strings match. Please ensure that your browser supports and accepts cookies, or your comment cannot be verified correctly.

Enter the string from the spam-prevention image above:
Enclosing asterisks marks text as bold (*word*), underscore are made via _word_.
Standard emoticons like :-) and ;-) are converted to images.
: Remember Information? Subscribe to this entry