WordPress-Theme-Tutorial für Anfänger – Teil 10: Weitere Vorlagen hinzufügen
In dieser Lektion des WordPress-Theme-Tutorials für Anfänger werden wir uns eingehender mit Vorlagen befassen. Wir lernen Vorlagenteile kennen und implementieren sie für die Wiederverwendbarkeit. Und wir werden unserem Design weitere Standardvorlagen von WordPress hinzufügen.
Aber bevor wir anfangen, weitere Vorlagendateien hinzuzufügen, müssen wir wissen, warum wir uns mit Vorlagenteilen beschäftigen sollten .
Vorlagenteile: Flexiblere Bausteine
Vorlagenteile funktionieren genauso wie get_header()und get_footer()was wir in Teil 2 gelernt haben, sind aber nicht auf diese Dateien beschränkt. Sie können Vorlagenteile für jede gewünschte Datei verwenden!
Themen verwenden häufig einen Vorlagenteil für Beiträge in einer Schleife. Normalerweise zeigen viele Vorlagen wie Kategorie, Archiv und Suchergebnisse jeden Beitrag in einer Schleife auf die gleiche Weise an. Es ist daher eine sehr gute Idee, die Post-Loop-Ausgabe in einer Datei aufzuteilen. Auf diese Weise müssen Sie es nicht in jeder Vorlage wiederholen.
Lassen Sie uns einen Teil unseres vorhandenen Codes in Vorlagenteile „konvertieren”, bevor wir mit der Erstellung weiterer Vorlagen beginnen!
Erstellen eines Post-Loop-Vorlagenteils
Erstellen Sie eine neue leere Datei in unserem Themenordner; genannt content-loop.php. Sie können die Vorlagenteile beliebig benennen. Aber Sie können sie nicht genauso benennen wie die von WordPress definierten Vorlagen. Suchen Sie in unserem index.php, alles, was Sie in der Schleife haben, schneiden Sie es aus und fügen Sie es in ein content-loop.php.
Verwenden Sie innerhalb der jetzt leeren Schleife in index.phpden Funktionsaufruf get_template_part()und definieren Sie Ihre Vorlagenteildatei als Parameter (ohne die .phpErweiterung). So sollte es in beiden Dateien aussehen:
...
while (have_posts()): the_post();
get_template_part('content-loop');
endwhile;
the_posts_pagination();
...Wenn Sie Ihre Titelseite aktualisieren, sollten Sie absolut keinen Unterschied feststellen.
Groß! Jetzt, da unsere index.phpschön und sauber ist, können wir sie als Basis verwenden, um sie in weitere Vorlagen zu duplizieren. Im Folgenden werde ich durchgehen, wie Sie eine Kategorievorlage und eine Suchergebnisvorlage hinzufügen, aber ich empfehle Ihnen, weitere Vorlagen zu erstellen, um mehr Kontrolle über das Design Ihres Themas zu haben.
Hinzufügen einer Kategorievorlage
Wenn Sie auf die WordPress-Vorlagenhierarchie zurückgreifen, können Sie sehen, dass WordPress für Beitragskategorien nach der Vorlage mit dem Namen sucht category.php. Das erstellen wir zuerst.
Erstellen Sie in Ihrem Themenordner eine Kopie der index.phpDatei und benennen Sie die Kopie in category.php.
Und das ist es. Sie sind im Grunde fertig …!
Wir werden jedoch ein Detail hinzufügen; wir wollen einen Titel anzeigen, der uns sagt, dass wir uns auf einer Kategorieseite für Beiträge in der Kategorie namens X befinden. WordPress hat dafür eine Funktion, die Sie in allen Archivvorlagen (Kategorie, Tags, Datumsarchive) verwenden können the_archive_title. Fügen wir es vor der Schleife in einem <h1>Tag hinzu.
Wenn Sie eine Beitragskategorieseite anzeigen, sollten Sie so etwas wie dieses mit dem Archivtitel „Kategorie: ” sehen. PS: Wenn Sie die Ausgabe des Archivtitels ändern möchten (z. B. „Kategorie: ” nicht anzeigen), können Sie get_the_archive_title einen Filter hinzufügen. Die Dokumentationsseite zeigt ein großartiges Beispiel dafür, wie man genau das macht.
Nun, das war einfach! Lassen Sie uns als Nächstes mit der Vorlage für Suchergebnisse umgehen.
Hinzufügen einer Suchergebnisvorlage
Die Vorgehensweise ist genau die gleiche wie bei Kategorievorlagen. Erstellen Sie dieses Mal eine Kopie von category.phpund benennen Sie die Kopie in um search.php.
Alles, was wir korrigieren müssen, ist der Titel. Die Archivtitelfunktion, die wir in der Kategorievorlage verwendet haben, funktioniert leider nicht sehr gut für die Suchergebnisvorlage. Tatsächlich gibt es in WordPress keine einfache Funktion, die uns einen Titel ausgibt.
Aber wir können leicht selbst eine erstellen, und gleichzeitig werde ich demonstrieren, wie man eine dynamische Variable ausgibt und den Text trotzdem übersetzbar hält.
PHP hat zwei nützliche Funktionen printf()und sprintf(). Sie tun dasselbe, außer dass printfsie es ausgeben (wie Echo) und sprintfzurückgeben, sodass wir es in einer Variablen speichern können. Nachdem wir den Text als ersten Parameter gesetzt haben, können wir dynamische Variablen als Argumente hinzufügen, die dann in den Text eingefügt werden. Innerhalb dieser können wir die übersetzbaren Textfunktionen __()und verwenden _e(). Ich empfehle Ihnen, sich ein wenig darüber zu informieren, wie printf oder sprintf funktioniert, da ich hier nicht weiter ins Detail gehen werde.
WordPress bietet eine einfache Funktion, um die gesuchte Zeichenfolge zu erhalten; get_search_query(). Lassen Sie uns die Archivtitelfunktion durch diese ersetzen;
Was der obige Code tut, ist von innen nach außen; Definieren eines übersetzbaren Textes „Suche: %s”, der in ein eingefügt wird printf, der die Zeichenkette wiedergibt, und die Zeichenkettenkonstante (%s) durch das zweite Argument ersetzt; was ist get_search_query().
Als Ergebnis erhalten wir bei der Suche nach „er” einen Titel wie diesen:
Nett! Wieder eine Vorlage fertig. Was den letzten Teil dieser Lektion betrifft, werden wir in unsere Vorlage für einzelne Posts gehen und etwas hinzufügen, das in WordPress sehr häufig vorkommt; die Kommentarvorlage.
Hinzufügen einer Kommentarvorlage zu einem einzelnen Beitrag
In unserem single.php, after the post Artikel wollen wir Kommentare zeigen. Die Kommentare sollten eine Liste früherer Kommentare und ein Formular zum Hinzufügen eines neuen Kommentars ausgeben.
Die Kommentarvorlage ist eine Vorlagendatei, die Sie Ihrem Design hinzufügen können, aber WordPress hat tatsächlich eine eigene Standardausgabe für Kommentarvorlagen. Wenn Sie dies nicht comments.phpin Ihrem Design haben, wird beim Anfordern der Kommentarvorlage die Standardausgabe von WordPress dafür zurückgegeben. Dies werden wir in diesem Tutorial tun.
Wir möchten die Kommentarvorlage nur aufrufen, wenn der Beitrag Kommentare aktiviert hat (es ist eine Einstellung für jeden Beitrag und eine globale Site-Einstellung). Also fügen wir eine if-Prüfung hinzu, um zu prüfen, ob die Kommentare erlaubt sind, comments_open()und wenn sie true zurückgibt, fordern wir die Kommentarvorlage mit an comments_template(). Denken Sie daran, dass all dies innerhalb der Schleife geschehen muss. Ich habe es nach dem Ende von hinzugefügt </article>, kurz bevor sich die Schleife schließt.
Wenn Sie einen einzelnen Beitrag besuchen, der Kommentare erlaubt hat (ich habe einen Kommentar hinzugefügt, um Ihnen auch die Liste der Kommentare anzuzeigen); Sie erhalten diese schöne (ähem) Standard-Kommentarvorlage:
Jetzt können Sie (und es wird oft empfohlen) Ihr eigenes Design comments.phpin Ihrem Design erstellen, das die Standardausgabe von WordPress überschreibt. Ich werde in diesem Tutorial jedoch keine Kommentarvorlage erstellen, da die Standardausgabe von WordPress gut funktioniert, solange Sie sie richtig gestalten. Wenn Sie sich den HTML-Code ansehen, sind viele Wrapper und Klassen verfügbar.