Schlagwort: css

Changelog: Responsive theme

Habe das theme mal mutwillig zu einem responsiven umgestaltet. Hat ganz gut funktioniert, wenn ich bedenke, dass ich wie auch schon hier oder hier relativ planlos am Werk war. Hauptseiten waren relativ easy umzugestalten, im Gegensatz zu custom-template Seiten wie dem Archiv oder verschachtelten Artikeln.

Wie dem auch sei, ich hoffe es gefällt. Über eine kurze Rückmeldung bei eventuell auftretenden Fehlern wäre ich dankbar.

“Beitrag gelesen” für twentyten – ein kleines How To

Es geht um eine nette kleine Funktion, die Andreas in’s Leben gerufen hat. Die Idee ist folgende: Viele Interessierte lesen Blogeinträge, jedoch nur wenige nehmen sich Zeit für einen Kommentar. Damit nun aber auch die Faulen, bzw. all diejenigen, die eigentlich nichts zu sagen haben, kurz ihren Senf dazugeben können, gibt es nun die Möglichkeit, einen Beitrag “als gelesen” zu markieren, anstatt ihn regulär zu kommentieren (was natürlich nach vor geht und erwünscht ist.) Auch der Stadtpirat hat dazu ein paar interessante Zeilen geschrieben, die mir sehr geholfen haben, das Ganze zu verstehen. Außerdem hat mittlerweile auch Felix dieses kleine Feature in leicht abgewandelter Form eingbaut. Ebendiese Form habe ich nun hier auch implementiert. Da der Core meines Themes hier allerdings das normale twenty ten ist, funktioniert die Implementierung ein wenig anders.

Ich selbst habe eigentlich keine Erfahrung mit PHP und jQuery, demnach war es ein ziemlich Gewurstel das umzusetzen. Mittlerweile funktioniert’s aber, weswegen ich in dieser Stelle gerne beispielhaft meinen Workaround der Integrierung dieser Funktion in ein twenty ten Theme erklären möchte. (mehr …)

Changelog: Boxen

Ich habe in den letzen Wochen mal wieder hier und da an ein paar Änderungen gebastelt und das Ganze letztendlich als neues theme abgelegt. Hier ein paar Gedanken dazu.

Idee

Schon mit den letzten Änderungen habe ich das Aussehen ein wenig minimalisiert, was ich mit dem neuen theme noch weiter voran treiben will. Text und Bild sind die wesentlichen Elemente des Blogs, und hier soll auch der Fokus liegen. Trotzdem möchte ich, gerade für Erstbesucher, eine gesteigerte Nutzerfreundlichkeit und ein paar nette Eyecatcher.

Änderungen

Wie ihr merkt, sind sowohl Design als auch Layout leicht abgeändert. Content erscheint nun in einer weißen Box auf grauem Hintergrund. Header, Hauptinhalt, Kommentare und Footer kriegen jeweils eine separate Box. Die Idee, reinen Content ohne Sidebar anzuzeigen, gefällt mir nach wie vor, jedoch wurde mir das Ganze durch die Artikel in kompletter Länge auf der Hauptseite zu unübersichtlich. Also Artikelbilder und more-tags fix wieder eingeführt. Ausserdem habe ich mal die Seiten im obigen Menü überarbeitet und mit individuellen templates ein wenig aufgehübscht. Ein hilfreiches Archiv gibt’s nun auch. Zudem gibt’s ein paar Spielereien mit CSS. Ich hoffe das neue Theme gefällt. Würde mich sehr über ein paar Kommentare oder Anregungen zu weiteren Verbesserungen freuen.

Einfache Sprechblasen mit CSS3

Sprechblasen zu gestalten ist seit CSS3 recht handlich geworden. Für einen Artikel wollte ich mir ein paar Exemplare basteln, stellte aber fest, dass die meisten Anleitungen im Netz entweder auf Englisch, schlecht erklärt, oder beides sind. Ein sehr gutes Tutorial gibt es von Nicolas Gallagher, der ein paar verschiedene Varianten vorstellt. Nun war das aber noch nicht so ganz, was ich mir vorgestellt habe. Ich wollte mehr Gestaltungsfreiheit bei gleichzeitig weniger Aufwand, so habe ich mir selbst ein wenig CSS zusammengeschrieben. Nachdem mir das Ergebnis sehr gut gefällt, möchte ich es an dieser Stelle ein wenig erklären und zur freien Verfügung bereitsetellen.

Vorweg: Ich habe das ganze Zeug in einer eigenen sprechblasen.css ausgelagert und reichlich kommentiert.

Grundgerüst
Das Prinzip ist einfach: Es wird nur eine Zeile Code benötigt, in einer div-Klasse werden alle gewünschten Parameter definiert. Ein Beipspiel einer unformatierten Sprechblase:

<div class=”sprechblase”>
 

(mehr …)

Changelog: Sidebar, Fotos größer,

Zum Ausklang eines genialen Wochenendes habe ich aus der Laune heraus noch fix ein paar kleine Änderungen am Layout vorgenommen.

(mehr …)