Eigenes WordPress Theme mit YAML erstellen – Teil 6

In unserem heutigen Teil des Tutorials beschäftigen wir uns mit der Artikelseite. Also der Seite, die einen einzelnen Artikel komplett anzeigt. Wer es schon einmal ausprobiert hat, wird feststellen, dass man sich schon einen einzelnen Artikel ansehen kann. Die Anzeige erfolgt dann aber genauso, wie auf der Startseite.

WordPress Template Hierarchie

Das bringt uns nochmal zur Struktur der WordPress Templates. Ruft man nämlich die Seite eines einzelnen Artikels auf, dann sucht WordPress zunächst nach der Datei „single.php“. Ist diese Datei nicht vorhanden, so wird wieder die Datei „index.php“ geladen.

WordPress bietet für verschiedene Darstellungen einer Seite unterschiedliche Templates an. Für die Startseite kann man die Datei „home.php“ verwenden, eine Darstellung einer Suche kann im Template „search.php“ definiert werden. Weitere Templates, die in einer definierten Hierarchie angeordnet sind, sind z.B. „archiv.php“, „404.php“, „page.php“, „category.php“ usw.

Eine sehr schöne Übersicht der Template Hierarchie findet man auf den Seiten von WordPress.

Die Artikelseite

Für die Darstellung eines Artikels müssen wir nun also die Datei single.php erstellen. Dies gelingt sehr einfach, in dem wir die Datei „index.php“ kopieren und umbenennen.

Auf der Startseite haben wir bisher mittels der Funktion „wp_excerpt“ nur einen kurzen Auszug des Textes angezeigt. Zusätzlich hatten wir einen eigenen „weiter lesen“ Link eingebaut. Der Aufruf „wp_excerpt“ kann nun in der Datei „single.php“ gegen die Funktion „the_content“ ausgetauscht werden.

Bei der Ausgabe des Titels können wir auf die Angabe des Links verzichten. Es muss also nur der eigentliche Titel mittels „the_title()“ ausgegeben werden.

Nun rufen wir noch das Tag „comments_template()“ auf. Damit wird das Template für die Anzeige der Kommentare geladen. Da in unserem Verzeichnis noch keine Datei „comments.php“ existiert, wird die Datei aus dem „default-Template“ geladen.

Der Code sieht nun folgendermaßen aus und sollte bereits auch ein erstes Ergebnis liefern. Beim Aufruf von „post_class“ haben wir übrigens diesmal die Klasse „artikelseite“ mit gegeben. So können wir bei Bedarf spezielle Formatierungen für diese Seite vornehmen.

<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<div <?php post_class('artikelseite'); ?> id="post-<?php the_ID(); ?>">
<div class="comments_count center">
<big><?php comments_popup_link('0', '1', '%', '', __('Comments Closed', 'tutorial'));
printf('</big><br/> <span class="highlight">');
_e('Kommentare', 'tutorial');?></span>
</div>
<h2><?php the_title(); ?></h2>
<div class="entry">
<?php the_content(); ?>
</div>
</div>
<hr/>
<?php comments_template(); ?>
<?php endwhile; ?>
<?php else : ?>
<h2><?php _e('Nichts gefunden', 'tutorial'); ?></h2>
<p><?php _e('Schade, leider gibt es hier keinen Artikel', 'tutorial'); ?></p>
<?php endif; ?>

Die Metadaten des Artikels

Wer gut aufgepasst hat, wird gemerkt haben, dass wir links neben dem Titel noch die Anzahl Kommentare stehen haben. Den Code aus der ursprünglichen „index.php“ hatten wir hier noch nicht angepasst. Also tauschen wir diesen Code gegen die Ausgabe des Datums aus.

Das Datum wird mit der Funktion „the_time()“ ausgegeben. Mit der Parameterübergabe steuert man, wie das Datum formatiert wird. Wir bauen also die Funktion an die Stelle ein, wo bisher die Kommentarzahl ausgegeben wird. Weiterhin ändern wird noch die Klasse „comments_count“ in „artikeldatum“. Mit dieser Klasse werden wir demnächst das Datum noch ein wenig schöner formatieren.

Nun wollen wir noch die Kategorien, die dem Artikel zugeordnet sind und die Tags ausgeben. Das machen wir direkt nach der Ausgabe des Titels.

Die Kategorien werden mit der Funktion „get_the_category_list“ und die Tags mit der Funktion „get_the_tag_list“ ermittelt.

Der Code zur Ausgabe des Artikels und der Metainformationen sieht nun wie folgt aus:

<div <?php post_class('artikelseite'); ?> id="post-<?php the_ID(); ?>">
<div class="artikeldatum center">
<?php the_time("d.m"); ?></br>
<?php the_time("Y"); ?>
</div>
<h2><?php the_title(); ?></h2>
<div class="postmeta">
<?php echo "Kategorie: ".get_the_category_list(', '); ?>
<br/><?php echo get_the_tag_list('Tags: ', ', '); ?>
</div>
<div class="entry">
<?php the_content(); ?>
</div>
</div>

So, für heute war es das erst mal. Im nächsten Tutorial kümmern wir uns ein wenig um die weitere Gestaltung, sowie ein eigenes Design für die Kommentare und bauen noch die zusätzlichen Bereiche für die „Empfehlungs-Button“ ein.

Die Dateien aus dem Verzeichnis „css“ habe ich euch wieder als zip-Datei zusammen gestellt.

[ad] [serialposts]