Ein eigenes WordPress Theme erstellen 7 – Unterschiedliche Beitragsformate individuell anzeigen lassen

Im fünften Teil dieser Tutorialreihe wurde in der functions.php des Themes die Unterstützung der unterschiedlichen Beitragsformate von WordPress hinzugefügt. Sinn hat diese Funktion aber erst dann, wenn wir diese Beitragsformate auch individuell von WordPress darstellen lassen. Um dies zu erreichen, legen wir für jedes Beitragsformat, welches individuell gestaltet werden soll, eine separate Datei an.

In diesem Tutorial beschränken wir uns dabei auf folgende Beitragsformate: Zitat (quote) und Bild (image).

In dieser Tutorialreihe haben wir, zwecks Übersichtlichkeit, den Beitrags- und Seiteninhalt von der index.php in die content.php ausgegliedert (Teil 4), welche wir mit get_template_part( 'content', get_post_format() ); aufrufen – für Fehlerseiten verwenden wir get_template_part( 'content', 'none' ); – welche den Dateinamen content-none.php trägt. Und nach genau dieser Art der Dateibenennung legen wir auch unsere Dateien für die Beitragsformate an. Dazu legen wir für dieses Tutorial die Dateien content-quote.php und content-image.php im Themeverzeichnis an und kopieren jeweils den Inhalt, der bereits vorhandenen content.php. Danach können wir auch schon mit der Bearbeitung der einzelnen Dateien beginnen.

Beitragsformat Zitat – content-quote.php

Ein Zitat mit Artikelbild? Wird wahrscheinlich niemand brauchen. Veröffentlichungsdatum, Author, Kategorie, Schlagworte und den Beitragstitel wahrscheinlich ebenfalls nicht. Für unsere Datei content-quote.php bedeutet das in diesem Fall, dass wir einiges an Tags entfernen können. Die Meinungen hierzu mögen zwar auseinander gehen, aber ich lösche einfach mal den gesamten <header>-Bereich des Artikels und im Artikel-<footer> zusätzlich noch die Anzeige von Kategorien und Schlagworte.

Ein paar Anpassungen nehmen wir auch bei der Anzeige des Inhaltes selbst vor. Ein Zitat ist ohnehin kurz und daher verzichten wir auch auf die Ausgabe des Inhaltes als Kurzfassung. Den „Weiterlesen„-Link können wir uns, genauso wie die Seitennavigation (wp_link_pages), ebenfalls schenken.

In diesem Fall würde der Inhalt der content-quote.php so aussehen.

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

    <section class="post-content">
        <?php
            the_content();
        ?>
    </section>

    <?php // Wenn: Benutzer eingeloggt
    if ( is_user_logged_in() ) { ?>
    <footer class="post-footer">
        <?php // Bearbeiten Link bei eingeloggtem Benutzer
        edit_post_link( __( 'Bearbeiten', 'zoechbauer' ), '<p class="post-meta">', '</p>' ); ?>
    </footer>
    <?php } ?>

</article>

Für das spätere individuelle Aussehen des Beitragsformates „Zitat“ können wir zB die WordPress-Tags the_ID() und post_class() benutzen. Unter anderem gibt ja post_class() auch das Beitragsformat aus in Form von format-quote, format-image usw.

Ein Beispiel hierzu für die style.css – Ein Artikel des Beitragsformates Zitat erhält die Hintergrundfarbe Gelb.

.format-quote {
    background-color: yellow;
}

Beitragsformat Bild – content-image.php

Auch beim Beitragsformat Bild könnten wir ein paar Sachen ändern. Da der Beitrag in diesem Fall ohnehin schon aus einem Bild besteht, eventuell noch mit ein wenig Text, wird es eher keinen Sinn machen auch noch ein Beitragsbild anzuzeigen. Veröffentlichungsdatum und den Author lassen wir bestehen. Auch den Beitragstitel, die Kategorie und die Schlagworte lassen wir anzeigen.

Die Kurzform des Inhaltes (the_excerpt) bei der Suchfunktion entfernen wir, den „Weiterlesen„-Link lassen wir jedoch bestehen, falls man zu einem Bild doch mal einen etwas längeren Inhalt hinzufügen möchte. Auf die Seitennavigation (wp_link_pages) verzichten wir auch hier wieder.

Der Inhalt der content-image.php nach den Anpassungen.

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

    <header class="post-header">

        <span class="posted-on">
            <?php // Veröffentlichungsdatum und Beitragsersteller/Author ?>
            Veröffentlicht am <time><?php the_time( 'j. F Y' ); ?></time> von <?php the_author_posts_link(); ?> <?php
            // Anzahl der Kommentare anzeigen
                comments_popup_link(
                    __( 'Keine Kommentare', 'zoechbauer' ),
                    __( '1 Kommentar', 'zoechbauer' ),
                    __( '% Kommentare', 'zoechbauer' ),
                    'comments-link',
                    __( 'Kommentare deaktiviert', 'zoechbauer' )
                );
            ?>
        </span>

    <?php // Überschrift/Titel nicht klickbar in der Beitrags- und Seitenansicht ansonsten schon
    if ( is_singular() ) { ?>
        <h1 class="post-title"><?php the_title(); ?></h1>
    <?php } else { ?>
        <h1 class="post-title"><a href="<?php the_permalink(); ?>" rel="bookmark" title="Link zu <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h1>
    <?php } ?>

    </header>

    <section class="post-content">
        <?php
        // Den Inhalt mit dem Weiterlesen-Link anzeigen - In der Einzelansicht den vollen Inhalt
            the_content( __( '<span class="post-more">Weiterlesen</span>', 'zoechbauer' ) );
        ?>
    </section>

    <?php // Wenn: Kategorie oder Schlagworte vorhanden oder Benutzer eingeloggt
    if ( get_the_category() || get_the_tags() || is_user_logged_in() ) { ?>
    <footer class="post-footer">
        <?php // Wenn Kategorie vorhanden
        if ( get_the_category() ) { ?>
        <p class="post-meta"><?php echo __( 'Kategorie:', 'zoechbauer' ); ?> <?php the_category( ', ' ); ?></p>
        <?php } ?>
        <?php // Wenn Schlagworte vorhanden
        if ( get_the_tags() ) { ?>
        <p class="post-meta"><?php echo __( 'Schlagworte:', 'zoechbauer' ); ?> <?php the_tags( '', ', ' ); ?></p>
        <?php } ?>
        <?php // Bearbeiten Link bei eingeloggtem Benutzer
        edit_post_link( __( 'Bearbeiten', 'zoechbauer' ), '<p class="post-meta">', '</p>' ); ?>
    </footer>
    <?php } ?>

</article>

Nach dem selben Prinzip könnte man jetzt auch noch die anderen Beitragsformate bearbeiten.

Nur zur Info / zur Erinnerung: Das Beitragsformat „Standard“ wird nicht nach diesem Prinzip bearbeitet – es ist eigentlich kein Beitragsformat!

Eine kleine Übersicht noch zu diesem Thema.

BeitragsformatThemedatei
Standardcontent.php
Kurzmitteilungcontent-aside.php
Audiocontent-audio.php
Chatprotokollcontent-chat.php
Galeriecontent-gallery.php
Bildcontent-image.php
Linkcontent-link.php
Zitatcontent-quote.php
Statusmitteilungcontent-status.php
Videocontent-video.php

Im nächsten Artikel erstellen wir unterschiedlichen Seiten-Vorlagen.




Bitte beachten Sie, dass dieser Beitrag bereits vor über einem Jahr geschrieben wurde und unter umständen nicht mehr aktuell ist.