Seit der Version 3.1 von WordPress stehen dem ambitionierten Blogger die sogenannten Post Formats zur Verfügung, die es ermöglichen Artikel auf unterschiedlichste Art im Blog darzustellen. Wer mich kennt weiß das ich für mein Leben gerne das Design meines Blogs ändere und immer mal wieder an der Darstellung via CSS herum bastel. Da ist es verständlich das ich von dieser neuen Möglichkeit total begeistert bin. Die letzten Tage verbrachte ich also damit mich mit der Materie auseinander zu setzen und möchte nun meine Erfahrungen mit meiner Leserschaft teilen.

Um die Post Formats nutzen zu können müssen sie zunächst in der Datei functions.php aktiviert werden. Wie das funktioniert und ein paar grundlegende Dinge zu den Post Formats könnt ihr in dem Artikel Flexibleres Bloggen durch Artikel-Formate (Post Formats) in WordPress 3.1 nachlesen. Ein paar Beispiele für den Einsatz von Post Formats bietet der Artikel Design-Inspirationen für Artikel-Formatvorlagen (Post Formats) in WordPress 3.1.

Ich habe die Formate “aside”, “gallery”, “link” und “quote” hier im Einsatz. Bei Artikeln, denen eines dieser Formate beim schreiben eines Artikels im Editor zugeordnet wird, fügt WordPress in seiner bescheidenen Genialität eine entsprechende CSS Klasse hinzu, die da lauten “format-aside”, “format-gallery”, “format-link” und …… richtig! “format-quote”.
Diese Klassen können dann in der CSS-Datei des themes definiert werden. Der Code in der CSS-Datei meines themes sieht folgendermaßen aus.

Die Gallery wird durch den Code definiert:

(aus dem Standard theme twentyten)

/* =Gallery listing
-------------------------------------------------------------- */

.format-gallery .size-thumbnail img,
.category-gallery .size-thumbnail img {
	border: 10px solid #f1f1f1;
	margin-bottom: 0;
}
.format-gallery .gallery-thumb,
.category-gallery .gallery-thumb {
	float: left;
	margin-right: 20px;
	margin-top: -4px;
}
.home #content .format-gallery .entry-utility,
.home #content .category-gallery .entry-utility {
	padding-top: 4px;
}

der Code für die Formate “aside”, “link” und “quote”:

(von mir erstellt)

.format-link a.more {
	display:none;
	}
.format-aside {
	background:#fffacd url(images/format-aside.png) top left no-repeat;
	border:1px solid #ddd;
	padding:25px 25px 25px 200px;
	min-height:150px;
	}
.format-image {
	float:left;
	display:inline;
	height:150px;
	width:150px;
	padding:10px;
	margin:0 30px 20px 0;
	}
.format-quote div.entry-content, .format-quote div#entry-summary {
	text-align:center;
	border:3px solid #666;
	background:#FF8C00;
	padding:20px;
	}
.format-quote div.entry-content h2.entry-title a, .format-quote div#entry-summary h2.entry-title a, .format-quote div.entry-content h2.entry-title a:hover, .format-quote div#entry-summary h2.entry-title a:hover {
	font-size:30px;
	color:#666;
	text-decoration:none;
	line-height:55px
	}
.format-quote div.entry-content h2.entry-title:before {
	content: '“ ';
	color:#666;
	font-weight:bold;
	font-family:Georgia, "Bitstream Charter", serif;
	font-size:35px;
	}
.format-quote div.entry-content h2.entry-title:after {
	content: ' ”';
	color:#666;
	font-weight:bold;
	font-family:Georgia, "Bitstream Charter", serif;
	font-size:35px;
	}

Bei dem Post Format “link” wird der eigentliche Linktipp noch durch die Klasse linktipp definiert, um den von mir als empfehlenswert eingestuften Link würdig zu präsentieren. Der Code lautet:

h2.linktipp {
	font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
	padding:10px;
	border:3px solid #0066cc;
	text-align:center;
	}
h2.linktipp a {
	color:#FF8C00;
	text-decoration:none;
	}
h2.linktipp a:hover {
	color:#FF8C00;
	text-decoration:none;
	}

Eine Menge Code, ich weiß. darum gehe ich hier auch nicht weiter auf die template-Dateien ein die involviert sind. Denen widme ich ein zwei folgende Artikel.

Wie siehts bei euch aus? Nutz ihr auch schon die Post Formats für eure Weblogs? Wie sind eure Erfahrungen und was haltet ihr von meiner Lösung?

verwandte Artikel

• Artikel auf der Startseite
• reset - es ist vollbracht
• verwandte Artikel
• WordPress.com Stats telefoniert nach Hause
• Bei meinem Blog ist der Wurm drin