Share
Ich denke, dass Sie mit Sicherheit sagen können, dass Sie als Blogger die neuesten Inhalte in Ihrem Blog hervorheben möchten, damit die Nutzer sie erkennen und lesen können. Es gibt verschiedene Möglichkeiten, dies zu tun, z. B. indem Sie für den ersten Beitrag auf Ihrer Blogseite ein anderes Format verwenden, um es hervorzuheben, oder es in der Seitenleiste hervorgehoben anzeigen.
In diesem Tutorial zeige ich Ihnen, wie Sie ein wenig weiter gehen können, als Sie CSS verwenden können: Statt Ihren ersten Blogbeitrag einfach anders zu gestalten, geben Sie andere Inhalte aus. Insbesondere wird der erste Beitrag einen Titel, ein hervorgehobenes Bild und einen Inhalt haben, während andere Beiträge nur den Titel, das vorgestellte Bild und einen Ausschnitt haben.
Sie können diese Technik anpassen: Wenn Sie nicht so viele Details wünschen, können Sie die Schleife in jeder der Abfragen ändern, mit denen wir arbeiten, sodass der erste Beitrag (z. B.) einen Titel, ein Bild und einen Auszug enthält habe nur den Titel und das Bild. Oder Sie können das abgebildete Bild für nachfolgende Beiträge weglassen. Es liegt an dir.
Die Technik, die wir dazu verwenden, beinhaltet die Verwendung der WP_Query Klasse, um eine zusätzliche Abfrage vor der Hauptabfrage in der zu schreiben home.php Vorlagendatei, die die Hauptblogseite steuert. Wir werden dann verwenden pre_get_posts () Ändern Sie die Hauptabfrage so, dass der letzte Beitrag nicht zweimal ausgegeben wird. Ich erstelle ein untergeordnetes Thema des Standard-Themas Twenty Fifteen und erstelle ein home.php Datei dazu sowie ein Stylesheet zum Einrichten des untergeordneten Designs.
Um diesem Tutorial zu folgen, benötigen Sie:
Wenn Sie mit dem Thema Twenty Fifteen arbeiten, müssen Sie zunächst Ihr untergeordnetes Design einrichten. Erstellen Sie einen neuen Ordner in Ihrem Ordner WP-Inhalt / Themen Verzeichnis und geben Sie einen Namen-ich rufe mein tutsplus-blog-page-two-loops. Erstellen Sie jetzt eine leere style.css Datei in diesem Ordner und fügen Sie Folgendes hinzu:
Accentsconagua
/ * Themenname: Tuts + Verwenden Sie zwei Schleifen auf Ihrer Blog-Hauptseite. URI: http://rachelmccollin.co.uk/wptutsplus-taxonomy-archive-list-by-second-taxonomy/ Beschreibung: Thema zum Erstellen des WPTutsPlus-Lernprogramms ein benutzerdefiniertes Taxonomie-Archiv. Kindermotiv für das Thema Fünfundzwanzig. Autor: Rachel McCollin Autor URI: http://rachelmccollin.co.uk/ Vorlage: fünfundzwanzig Version: 1.0 * / @import url ("… /twentyfifteen/style.css");Dies teilt WordPress mit, dass Ihr Design ein Kind des Twenty Fifteen-Themas ist und das Stylesheet aus diesem Thema importiert. Möglicherweise möchten Sie einige Details bearbeiten, um die Tatsache widerzuspiegeln, dass dies Ihr Thema ist.
Da dies die Hauptblogseite ist, die Sie ändern möchten, müssen Sie eine Vorlagendatei für das untergeordnete Design erstellen. Die Vorlagendatei, die Sie erstellen müssen, ist home.php, Hierdurch wird die Hauptblogseite aktiviert, unabhängig davon, ob sie die Titelseite Ihrer Website ist oder nicht.
Erstellen Sie eine Datei mit dem Namen home.php in Ihrem Designordner.
Jetzt öffnen Sie die index.php Datei in Twenty Fifteen und kopieren Sie den Code am Anfang und Ende dieser Datei (d. h. nicht in der Schleife). Ihre Datei sieht ungefähr so aus:
__ ('Vorherige Seite', 'Fünfundzwanzig'), 'next_text' => __ ('Nächste Seite', 'Zwanzigzehn'), 'before_page_number' => ''. __ ('Seite', 'fünfundzwanzig'). ' ',)); ?>
Wenn Sie ein eigenes Design verwenden, kopieren Sie den entsprechenden Code aus Ihrem Theme index.php Datei stattdessen, so dass Sie die enthaltenden Elemente für Ihre Seite, aber keine Schleife haben.
Im nächsten Schritt erstellen Sie die erste Schleife, in der der letzte Beitrag vollständig angezeigt wird.
Unter dem Verschluss Tag in Ihrem home.php Datei, fügen Sie die Argumente für die Abfrage hinzu:
$ args = array ('posts_per_page' => '1',);Dies wird nur nach dem neuesten Beitrag abfragen. Beachten Sie, dass Sie den Beitragstyp nicht angeben müssen. Dies ist der Standardwert 'Post'.
Fügen Sie nun die Schleife unter Ihren Argumenten hinzu:
$ query = new WP_query ($ args); if ($ query-> have_posts ()) ?> have_posts ()): $ query-> the_post (); / * die Schleife starten * /?>> ', esc_url (get_permalink ())),''); ?> "> 'left', 'alt' => trim (strip_tags ($ wp_postmeta -> _ wp_attachment_image_alt))))); ?>
Diese Schleife gibt den Posttitel, die Miniaturansicht (sofern vorhanden) und den Inhalt aus.
Beachten Sie, dass ich eine zusätzliche Klasse hinzugefügt habe, .erster Beitrag, in dem post_class () Vorlagen-Tag. Wenn Sie Ihren ersten Beitrag mit CSS hervorheben möchten, bietet Ihnen diese zusätzliche Klasse eine einfache Möglichkeit.
Es ist sehr wichtig, dass Sie hinzufügen rewind_posts () nach der Schleife, da sonst die nächste Schleife nicht funktioniert.
Die zweite Schleife ist sehr ähnlich, aber anstatt zu verwenden WP_Query, Es greift einfach auf die Hauptabfrage zu.
Fügen Sie unterhalb der gerade hinzugefügten Schleife die zweite Schleife hinzu:
> ', esc_url (get_permalink ())),''); ?> "> 'left', 'alt' => trim (strip_tags ($ wp_postmeta -> _ wp_attachment_image_alt))))); ?> "> Weitere Informationen.
Diese Schleife ist der ersten sehr ähnlich, jedoch mit zwei Unterschieden:
.erster Beitrag Klasse.Speichern Sie jetzt Ihre Datei.
Wenn Sie auf Ihrer Blog-Hauptseite nachsehen, sehen Sie, dass der letzte Beitrag zweimal angezeigt wird. Wir werden das beheben, indem wir die Hauptabfrage mit der pre_get_posts Haken.
Erstellen Sie eine neue Datei in Ihrem Design Functions.php. Wenn Sie alternativ mit Ihrem eigenen Design arbeiten und bereits eine Funktionsdatei vorhanden ist, öffnen Sie diese.
Fügen Sie diesen Code zu Ihrer Funktionsdatei hinzu:
is_home () && $ query-> is_main_query ()) $ query-> set ('offset', '1'); add_action ('pre_get_posts', 'tutsplus_offset_main_query');Dadurch wird die Hauptabfrage jedoch nur auf der Startseite gefiltert, wobei ein Versatz von 1 hinzugefügt wird.
Speichern Sie nun Ihre Datei und werfen Sie einen Blick auf Ihre Blog-Hauptseite:
Es gibt ein Problem. Da mein Blog einen klebrigen Beitrag hat, wird dieser über dem letzten Beitrag angezeigt, was ich nicht will. Es zeigt auch den gesamten Inhalt des neuesten Beitrags und des klebrigen Beitrags.
Dies kann leicht korrigiert werden. Öffne dein home.php Datei erneut und fügen Sie den Argumenten für Ihre erste Abfrage ein weiteres Argument hinzu:
'ignore_sticky_posts' => true
Dadurch wird sichergestellt, dass WordPress klebrige Beiträge beim Ausführen der ersten Schleife ignoriert. Ihr erster Satz von Abfrageargumenten sieht jetzt so aus:
$ args = array ('posts_per_page' => '1', 'ignore_sticky_posts' => true);Speichern Sie nun die Datei erneut und überprüfen Sie Ihre Blogseite:
Das ist besser! Der jüngste Beitrag steht ganz oben und der klebrige Beitrag befindet sich darunter, nur mit seinem Auszug. Wenn Sie weiter nach unten scrollen, sehen Sie, dass die anderen Posts auch nur einen Auszug zeigen:
Wenn Sie klebrige Posts in Ihrer zweiten Schleife ignorieren möchten, können Sie dies durch Hinzufügen von ignore_sticky_posts Argument zu Ihrer zweiten Abfrage. Ich möchte, dass klebrige Posts so funktionieren, wie sie sollten, mit Ausnahme meines letzten Posts. Ich werde es jedoch nicht tun.
Sie werden feststellen, dass wenn Sie in Ihrem Blog zur zweiten und zu den folgenden Postseiten (d. H. Zu den paginierten Seiten) navigieren, dieselben Posts angezeigt werden wie auf der ersten Seite. Das bedeutet, dass nur Ihre zehn letzten Posts angezeigt werden! Dies liegt daran, dass beim Versetzen der Hauptabfrage die Paginierung beschädigt wurde.
Glücklicherweise lässt sich dies leicht korrigieren, indem Sie die hinzugefügte Funktion ändern pre_get_posts Haken.
Öffne dein Functions.php Datei erneut und bearbeiten Sie die Funktion so, dass sie wie folgt lautet:
Funktion tutsplus_offset_main_query ($ query) if ($ query-> is_home () && $ query-> is_main_query () &&! $ query-> is_paged ()) $ query-> set ('offset', '1'); Was wir hier gemacht haben, ist das hinzugefügt is_paged () Bedingter Tag. Dies prüft, ob andere Seiten als die allerersten paginiert sind, und gibt true zurück, wenn der Besucher die zweite oder nachfolgende Seite von Beiträgen betrachtet. Durch die Nutzung !$ query-> is_paged (), Wir stellen sicher, dass die Abfrage nur versetzt wird, wenn die Seite ist nicht paginiert.
Speichern Sie jetzt Ihre Datei und überprüfen Sie sie erneut. Die Paginierung funktioniert jetzt einwandfrei.
Sie werden feststellen, dass derselbe letzte Beitrag immer noch oben auf der Seite angezeigt wird. Dies liegt daran, dass die Seite dieselbe Vorlage und die gleichen beiden Schleifen verwendet.
Auf meiner Website lasse ich das gerne so wie es ist, weil ich möchte, dass der letzte Beitrag sehr prominent ist. Wenn Sie dies jedoch ändern möchten, fügen Sie Ihrer ersten Abfrage ein zusätzliches Argument hinzu, nämlich 'paged' => false.
Das Ändern der Art und Weise, wie die Hauptseite Ihres Blogs veröffentlicht wird, ist mit der WP_Query Klasse mit der pre_get_posts Haken. In diesem Tutorial haben Sie gelernt, wie Sie:
WP_Query um den ersten Beitrag vollständig auszugebenSie können diese Technik anpassen, um den neuesten Beitrag aus einer bestimmten Kategorie anzuzeigen, andere Inhalte in Ihrer Schleife zu verwenden und vieles mehr.
