Wie kann ich eine WordPress Seite mit Beiträgen einer Kategorie erstellen – oder: page with posts

Wer so wie ich mal viel Zeit mit dem Weaver Theme (Weaver II oder aktueller: Weaver Xtreme) verbracht hat, weiß sicherlich die bei ihm so einfach zu realisierende Möglichkeit der WordPress Seite mit Beiträgen einer Kategorie (oder auch mit zwei oder drei Kategorien) zu schätzen. Weaver bringt hierfür ein sogenanntes Seiten-Template (eine Formatvorlage) mit. Die bietet dann per formularartiger Abfrage die Auswahl, welche Beiträge auf dieser Seite erscheinen sollen. Andere Themes bieten eine solche Funktionalität nicht. Doch lässt sie sich erstellen, sei es nun via Plugin oder selbst geschrieben.

Wozu eine Seite mit Beiträgen einer Kategorie erstellen?

Stellen Sie sich vor, Sie haben zwei verschiedene Produktarten im Angebot: Bücher und Filme. Obst und Gemüse. Damen- und Herrenmode. Für die einzelnen Produkte erstellen Sie Beiträge, die Sie entsprechend kategorisieren. Statt im Menü nun aber die Kategorien buecher und filme (oder obst und gemuese …) abzurufen, verweisen die Einträge auf zwei Seiten, die Sie hierfür angelegt haben. Im Gegensatz zu Kategorie-Seiten können diese Seiten ein wenig Einleitungstext zeigen, vielleicht mit passendem Foto, bevor darunter automatisch alle Beiträge der passenden Kategorie erscheinen. Gerade für jemanden, der nicht regelmäßig bloggen möchte, den Funktionsvorteil von Beiträgen aber nicht missen möchte, ist dies ein sehr interessantes Vorgehen.

Die Plugin-Lösung: Posts in Page

Das WordPress Plugin Posts in Page von IvyCat Web Services stellt eine recht einfach Lösung dar: Nach der Installation stellt das Plugin einen Shortcode zur Verfügung, den Sie an gewünschter Stelle in Ihre Seite kopieren. Unter Einstellungen > Posts in Page finden Sie eine Bedienungsanleitung für diesen Shortcode.

Der Shortcode an sich [ic_add_posts] macht nichts anderes, als alle Beiträge abzurufen. Möchten Sie eine Auswahl, also zum Beispiel eine konkrete Kategorie, braucht es eine weitere Angaben innerhalb des Shortcodes: [ic_add_posts category=’Kategoriename’]. Weitere Definitionen sind die Anzahl der Beiträge (showpost=’5′) oder die Art der Sortierung, sofern sie nicht dem Standard chronologisch, aktuellster zuerst folgen soll (orderby=’title’ order=’ASC’).

Machbar ist damit eine ganze Menge: Stellen Sie sich die Bücher-Seite vor, die nach einem Einleitungstext unter drei entsprechenden Überschriften Ihre drei aktuellsten Rezensionen zu Liebesromanen, Horror- und Kinderbüchern anzeigt. Mit dem Plugin Posts in Page ist das unproblematisch möglich:

<p>Willkommen in meiner Bücherecke! Hier finden Sie meine aktuellsten Buchbesprechungen. Schauen Sie selbst:</p>
<h3>Liebesromane</h3>
[ic_add_posts category='liebe' showpost='3']
<h3>Horror: Vampire und Zombies</h3>
[ic_add_posts category='horror' showpost='3']
<h3>Kinderbücher</h3>
[ic_add_posts category='kinder' showpost='3']

Bei diesem Vorgehen sorgt das Plugin dafür, dass immer die aktuellsten drei Beiträge auf dieser Seite erscheinen. Veröffentlichen Sie eine neuen Beitrage zu den Liebesromanen, fällt der letzte in der Liste weg.

Das Problem: die fehlende Paginierung

Unabhängig davon, ob Sie nun in dem Shortcode eine Anzahl an Beiträgen definieren oder dies dem WordPress Standard (10 Beiträge pro Seite) überlassen: Das Plugin löst keine Paginierung aus.

Nehmen wir eine Seite Filme. Auch hier gibt ein paar freundliche Worte vorweg, dann folgen Ihre Filmbesprechungen. In dem Moment, da Sie Ihre elfte Filmbesprechung veröffentlichen, sollte WordPress eine weitere Seite anlegen, auf der die älteste Ihrer Filmbesprechungen erscheint. Und genau das leistet das Plugin leider nicht.

Wenn die Paginierung wichtig ist, bleibt nichts anderes übrig, als selbst Hand anzulegen. Aber Achtung: Dieses Vorgehen ist definitiv für Fortgeschrittene gedacht!

Eine Seite mit Beiträgen einer Kategorie selbst schreiben – am Beispiel des Themes Twenty Sixteen

Dieses Vorgehen macht es nötig, sich einmal mehr mit PHP zu beschäftigen. Kurz: Für die Darstellung einer WordPress Seite ist die Datei page.php verantwortlich. In ihr steht alles, was das Theme braucht, um zu wissen, welches Element es an welcher Stelle ausgegeben soll. Für uns nun stellt die page.php die Grundlage dar für die zu erstellende neue PHP-Datei, die Sie zukünftig als Vorlage (Template) nutzen.

Eine neue Vorlage erstellen

Hierfür brauchen Sie Zugriff auf Ihren Webspace. Dieser erfolgt über ein FTP-Programm wie Filezilla oder Cyberduck. Haben Sie sich mit Ihren FTP-Zugangsdaten auf Ihrem Webspace angemeldet, navigieren Sie dort im Verzeichnis wp-content zu dem Ordner themes. Dort finden Sie einen Ordner mit dem Namen Ihres Themes. In diesem Ordner befinden sich eine Reihe von PHP-Dateien, so auch die page.php und die archive.php. Laden Sie beide Dateien in ein Verzeichnis Ihrer Wahl auf Ihre Festplatte herunter.

Nun öffnen Sie die page.php mit einem Texteditor, zum Beispiel Notepad++, es kann aber auch zum Beispiel der Editor Ihres Windows-Systems sein.

Die Datei beginnt mit öffnenden PHP-tag. Danach folgen Angaben, die innerhalb von Schrägstrichen stehen. Diese Angaben ersetzen wie folgt:

<?php
/**
* Template Name: NAME IHRES SEITENTEMPLATES
*
*
* @package Twenty Sixteen
*/

In der page.php steht eine ganze Menge, ein wild anmutende Mischung aus PHP- und HTML-tags. Wir haben uns aber hier schon einmal mit dem Loop beschäftigt. Den finden Sie auch in der page.php.

Wir wollen an das Ende des Loops und werden zwischen seinem Ende und dem abschließenden main-tag die wesentlichen Änderungen vornehmen:

// End of the loop.
endwhile;
?>
HIER ERFOLGEN DIE ÄNDERUNGEN
</main><!-- .site-main -->
<?php get_sidebar( 'content-bottom' ); ?>
</div><!-- .content-area -->
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Einen zweiten Loop eröffnen

Nun eröffnen Sie einen zweiten Loop. Hierfür bedienen wir uns an der archive.php. Was wir brauchen, ist wiederum der Loop, nun aber den der archive.php, sowie die Pagination (previous/next page navigation), die Twenty Sixteen hier in seiner archive.php mit aufführt. Die exakte Auswahl des Codes aus der archive.php, die wir brauchen, habe ich hier aufgeführt.

<?php
// Start the Loop.
while ( have_posts() ) : the_post();
/*
* Include the Post-Format-specific template for the content.
* If you want to override this in a child theme, then include a file
* called content-___.php (where ___ is the Post Format name) and that will be used instead.
*/
get_template_part( 'template-parts/content', get_post_format() );

// End the loop.
endwhile;

// Previous/next page navigation.
the_posts_pagination( array(
'prev_text' => __( 'Previous page', 'twentysixteen' ),
'next_text' => __( 'Next page', 'twentysixteen' ),
'before_page_number' => '<span class="meta-nav screen-reader-text">' . __( 'Page', 'twentysixteen' ) . ' </span>',
  ) );
?>

Kopieren Sie alles und fügen Sie es in Ihr Seitentemplate ein, und zwar zwischen dem Ende des ersten Loops und dem abschließenden main-tag .

Die Kategorie und die Anzahl der Beiträge definieren

Zwischen den beiden Loops definieren Sie nun, welche Beiträge Sie anzeigen wollen. Im Moment würde Ihr Template alle Beiträge anzeigen. Wir aber wollen ja nur eine Kategorie, und das braucht eine Definition:

<?php $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array(
'category_name' => 'fussball',
'paged' => $paged,
'posts_per_page' => 2
);

query_posts($args); ?>

In diesem Beispiel heißt die Kategorie fussball und ich möchte tatsächlich nur 2 Beiträge pro Seite zeigen. Sie können natürlich eine ganz andere Kategorie wählen und sich für 20 Beiträge pro Seite entscheiden. Auch können Sie mehr als eine Kategorie anzeigen lassen: Mehrere Kategorien trennen Sie innerhalb der einfachen Anführungszeichen mit Kommata.

Speichern Sie Ihr Seitentemplate unter einem neuen Namen (zum Beispiel: testtemplate.php) und laden Sie es nun mit Ihrem FTP-Programm in denselben Theme-Ordner, in dem sich die page.php und die archive.php befinden.

Das Seitentemplate einer Seite zuordnen

Ab jetzt arbeiten Sie wieder im Backend Ihrer WordPress Installation. Öffnen Sie die Seite, der Sie Ihr neues Seitentemplate zuordnen wollen – oder falls es die Seite noch gar nicht gibt, erstellen eine neue. In der Bearbeitung finden Sie (nun) in der Box Attribute unter Eltern den Eintrag Template. Die Auswahl zeigt standardgemäß das Standardtemplate. Wählen Sie dort Ihr Template aus. Falls Sie es dort (noch) nicht sehen, aktualisieren Sie die Seite. Falls Sie es dann immer noch  nicht sehen, haben Sie etwas falsch gemacht.

Nach der Auswahl Ihres Seitentemplates speichern Sie Ihre Seite und schauen sich die Vorschau an. Wenn sie ungefähr so aussieht, haben Sie alles richtig gemacht:

Page with Posts: Eine Seite mit Beiträgen einer Kategorie
Eine WordPress Seite mit Beiträgen einer Kategorie und Paginierung

Das Template können Sie übrigens fortan auch im Backend Ihrer Installation bearbeiten. Wählen Sie hierfür Design > Editor. In der Liste der dort zur Verfügung stehenden Dateien erscheint nun auch Ihr Seitentemplate.

Wer hat’s erfunden?

Ich habe diese kleine Anzahl an Beiträgen pro Seite gewählt, um einen Effekt zu verdeutlichen: Mit dieser PHP-Definition, die Kategorie und Beitragsanzahl abfragt, ist die Paginierung möglich. Ich selbst habe lange nach der passenden Lösung gesucht, und ich werde jetzt nicht behaupten, ich hätte sie mir auf Basis meiner unglaublichen PHP-Kenntnisse erarbeitet. Vielmehr habe ich diese Lösung im Support von wordpress.org gefunden https://wordpress.org/support/topic/pagination-on-custom-page-template und sie im Rahmen meines Testblogs und des dort installierten Twenty Sixteen Themes getestet.

Während mein Dank also an @bobbyadamson on WordPress.org geht, kann ich wirklich nur jedem empfehlen: Im Zweifel die Community befragen, die weiß eigentlich immer Rat!


Beitragsbild: Britta Kretschmer

15 Anmerkungen zu “Wie kann ich eine WordPress Seite mit Beiträgen einer Kategorie erstellen – oder: page with posts

  • 1. September 2016 um 21:01
    Permalink

    Vielen Dank für die Anleitung!
    Das einzige Problem, das ich jetzt noch habe, ist, dass die Beiträge auf den Seiten ganz blöd und anders formatiert sind als auf der Startseite…. Irgendwelche Tipps dazu?

  • 2. September 2016 um 10:57
    Permalink

    Hallo Silvia,

    bei der Frage geht es wahrscheinlich um das Plugin Posts in Page. Das bringt für die Darstellung ein eigenes Template mit: posts_loop_template.php (findet sich im Verzeichnis wp-content/plugins/posts-in-page). Wenn die Darstellung exakt der des Twenty Sixteen Themes entsprechen soll, diese Datei via FTP in das aktive Theme-Verzeichnis kopieren und den Inhalt der posts_loop_template.php ersetzen durch den Inhalt der content-single.php (vielleicht noch mit einem DIV mit einer Klasse ivycats oder ähnliches umschließen, um Details in der Ausgabe ansprechen zu können).

    Alternativ (aber weniger weitgehend): Die einzelnen Elemente und Klassen lassen sich per CSS über ein vorangestelltes .ivycat-post ansprechen. Das ändert aber nur Farbe, Größe, Abstände etc. und fügt keine Elemente wie fehlende Beitragsbilder hinzu.

    LG, bk

  • 6. Februar 2017 um 8:41
    Permalink

    Hallo, danke für die tolle Anleitung!

    Zwei Fragen: Wie kann ich nur kleine Thumbnails anzeigen anstelle der kompletten Artikelbilder?
    Und wie kann ich einen Offset integrieren, so dass unter z.B. 3 Artikel-Exzerpten mit Thumbnail in einem weiteren Loop nur die Überschriften (und ohne Bild) einiger weiterer Artikel gezeigt werden?
    Danke! VG sf

  • 7. Februar 2017 um 12:15
    Permalink

    Hallo Stefan,

    allein die Frage nach den Bildgrößen wäre schon einen längeren Beitrag wert… ;-)

    Hier erst einmal nur so viel – am Beispiel von Twenty Seventeen: Für die Darstellung ist die content.php zuständig. Dort wird in Zeile 47 das Post Thumbnail aufgerufen, und zwar in der Theme eigenen Definition twentyseventeen-featured-image. Soll das Thumbnail die Medium-Größe anzeigen, lautet es stattdessen medium, für die kleinste Größe wäre es thumbnail. Damit das Ganze dann auch noch gut aussieht, die Klasse .post-thumbnail entsprechend definieren.

    Für eine vernünftige Antwort auf die Frage nach den mehrfachen Loops reicht hier definitiv der Platz nicht aus. Vielleicht gibt es dazu mal einen ausführlichen Beitrag.

    LG, bk

  • 11. Februar 2017 um 13:40
    Permalink

    Hi Britta, danke schön! Ich hatte gehofft, es wäre mit einer einfachen Anweisung im args-arry getan … Z.B. ‘offset’=> 3, also:

    ‘fussball’,
    ‘paged’ => $paged,
    ‘posts_per_page’ => 2,
    ‘offset’ => 3
    );

    Aber das habe ich mir auch nur irgendwoher zurechtgefummelt, und als Nicht-PHPler weiß ich nicht, ob es so funktioniert. Drum die Frage.
    Trotzdem auf jeden Fall danke – Antwort 1 ist auf jeden Fall hilfreich.
    VG, Stefan

  • 12. Februar 2017 um 12:26
    Permalink

    Hallo Stefan,

    okay, das klingt ja schon mal gar nicht so schlecht. Grundprinzip: Die erste Abfrage (mit Beitragsbildern) stellt über posts_per_page 3 Beiträge dar. Und in der zweiten (nur Beitragstitel) sorgt das offset => 3 dafür, dass die drei schon dargestellten Beiträge hier eben nicht mehr erscheinen.

    LG, bk

  • 16. Januar 2018 um 9:13
    Permalink

    Hallo,
    der Tip zum Plugin “Posts in Page” ist goldwert – genau dies habe ich gesucht. Vielen Dank für diesen Beitrag.
    Ich habe nur eine Frage und zwar wird bei mir unterhalb des Beitrages nun eine zusätzliche zeile wie folgt auch eingeblendet:
    Posted in Aktuelles(Kategoriename) | Kommentare 17-04 Zertifizierung-MPA | Edit

    Ich habe eigentlich in meinem Theme die Kommentare und das Datum deaktiviert – bei Standard-Wordpress werden diese Informationen ansonsten ja oberhalb des Beitrages angezeigt. Aber wie erwähnt habe ich dies deaktiviert.
    Das Plugin aber blendet nun unterhalb des Beitrages die oben erwähnte Zeile ein… und ich weiß nicht wie ich diese komplett deaktivieren kann.
    Über einen Tip wäre ich dankbar :)
    Viele Grüße
    Stefan

  • 16. Januar 2018 um 11:20
    Permalink

    Hallo Stefan,

    das Plugin benutzt ja seine eigene Vorlage für die Ausgabe und gibt für die Meta-Angaben eine eigene Klasse aus: .entry-utility. Um diese Meta-Angaben auszublenden, heißt es schlicht:

    .entry-utility {display:none;}

    LG, bk

  • 16. Januar 2018 um 13:37
    Permalink

    Hallo Britta,
    supi hat geklappt – jetzt gerade noch eine Frage: kann es sein dass das Plugin bei Beiträgen die Anzahl an Zeichen (oder zeilen) begrenzt?

  • 16. Januar 2018 um 15:57
    Permalink

    Ich hab die Einstellung gefunden – in den Theme-Optionen konnte ich dies ändern über den
    Excerpt-Wert …

  • 17. Januar 2018 um 20:59
    Permalink

    Hallo Britta,
    doch ich mußte in den Theme-Optionen den Excerpt-Wert vergrößern, dann ging es.

    Aber ich habe nun ein ganz anderes Problem mit diesme Plugin:
    Wenn ich in Beiträgen mit Div-Containern arbeite (dieselben wie in Seiten … dort funktioniert dies auch), dann werden diese div-Container bei den Beiträgen mit “Posts in Page” nicht ausgewertet bzw. ignoriert.
    Kannst Du Dir dies erklären?
    LG Stefan

  • 18. Januar 2018 um 11:20
    Permalink

    Hallo Stefan,
    deshalb mein Tipp, sich in die Excerpt-Thematik und die Unterschiede zwischen Teaser, automatischem und manuellem Auszug zu vertiefen!

    Das Plugin ruft the_excerpt auf (das Theme wahrscheinlich the_content) und kann deshalb mit allen dreien etwas anfangen. Vor allem aber kann es mit dem manuellen Auszug, und der kann HTML. Andererseits lässt sich natürlich auch die Excerpt-Klasse .entry-summary formatieren.

    Welches Vorgehen sinnvoller ist, kommt auf die konkrete Aufgabenstellung an. Aber einmal die Vorzüge des manuellen Auszugs kennengelernt, mag man gar nicht mehr ohne.
    LG, bk

  • 18. Januar 2018 um 11:56
    Permalink

    Hallo Britta,
    ich bin mir nicht sicher ob wir hier aneinander vorbei reden – das Problem dass nach Aktivierung des “Posts in Page” KEINE Fotos mehr aus Beiträgen angezeigt werden wie auch keine DIV-Container etc.
    Mit dem Plugin wird nur noch der blanke Text angezeigt.
    Mit Excerpt wird doch nur die Länge des Beitrages festgelegt – somit kann dies doch nichts zu tun haben, dass z.B. der Text anstatt eine Breite von 100% der Seite zu nutzen, somit nur z.B. 500px breit sein soll.
    Somit lässt sich dieses Problem nicht mit Excerpt festmachen.
    es muss mit dem Plugin “Posts in Page” zusammen hängen…

  • 18. Januar 2018 um 14:42
    Permalink

    Hallo Stefan,

    Posts in Page nutzt ein eigenes Template für die Ausgabe. Das befindet sich im entsprechenden Plugin-Verzeichnis und heißt posts_loop_template.php. Weil es nur das Excerpt abruft, gibt es das Beitragsbild und auch eigene DIVs nicht aus. Beim Excerpt geht es eben nicht nur um die Anzahl der Zeichen.

    Entweder: Dieses Template den eigenen Wünschen gemäß bearbeiten (z.B. statt the_excerpt the_content abrufen, somit auch das Beitragsbild und die eigenen DIVs), unter neuem Namen im Childtheme-Ordner abspeichern und dann im Shortcode dieses Template definieren, z.B.: template=’eigenes-template.php’ (wenn es denn so heißt).

    Oder als Template die content.php des Themes wählen. Das sollte auch funktionieren.

    LG, bk

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.