Wordpress “post_class” für die CSS-Datei

wp_logoTheme Entwickler können mit dem Wordpress Template Tag “post_class” ihre Artikel in der CSS-Datei wesentlich effektiver Gestalten. Diese Funktion fügt automatisch unterschiedliche post container Klassen zu den Artikeln hinzu, die sonst in der index.php, single.php oder anderen Template-Dateien umständlich manuell eingefügt werden müssten.

 

Das “post_class” Template Tag erstellt die CSS-Klassen nur für den Artikel-Bereich. Für die Gestaltung der ganzen Seite mit eindeutigen CSS wird “body_class” verwendet.

 

Der folgende Aufruf wird am Anfang des Loop(Schleife) gesetzt.

<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

 

“post_class” fügt automatisch einen oder mehrere Klassen-Attribute, je nach Seitenaufruf ein.

 

class-Attribute

.post-id
.post
.attachment
.sticky
.hentry
(hAtom microformat pages)
.category-ID
.category-name
.tag-name
.format-name

 

Beispiel HTML-Ausgabe der index.php

<div id="post-207" class="post-207 post type-post status-publish format-standard hentry category-allgemein">

 

In der style.css kann nun das Design definiert werden.

 

Beispiele style.css

.post-207 {…}

.post {…}

.format-standard {…}

.hentry {…}

.category-allgemein {…}

 

 

Hinzufügen weiterer Klassen

Die Template Tag Parameter können erweitert werden. Im Beispiel wird eine eindeutige Klasse hinzugefügt.

<div id="post-<?php the_ID(); ?>" <?php post_class('klasse'); ?>>

 

 

Artikel außerhalb des Loop(Schleife)

<?php post_class('',$post_id); ?>

Der zweite Parameter ist hier die post ID für die Ansicht des Artikels außerhalb des Standard-Loop.

 

Die Funktion “post_class” wird seit Wordpress Version 2.7 unterstützt. Die Klasse “post-formats” wurde in Version 3.1 hinzugefügt.

 

Für eine Weiterverarbeitung der Klassen ohne echo-Ausgabe in den Template-Dateien kann “get_post_class( )” verwendet werden.

 

 

Weitere Informationen:

Formatvorlagen Post Formats.

Unterschiedliche Sidebars in der sidebar.php.

Wordpress index.php erstellen.

Unterschieliches Aussehen der Artikel auf der Startseite.

Navigationsmenü einbauen.

Favicon erstellen und in Wordpress einfügen.