In dieser Folge unserer Artikelserie „WordPress Theme anpassen wie ein Profi“ werden wir die WordPress Templates bearbeiten, um damit jedes beliebige WordPress Theme nach den eigenen Wünschen zu individualisieren. Du erfährst dabei, was der Unterschied zwischen WordPress Templates und WordPress Themes ist, welche verschiedenen Templates es gibt und wie du herausfinden kannst, welches Template du bearbeiten musst, um eine Änderung durchzuführen.
Das dazugehörige Video weiter unten im Beitrag zeigt dir 2 Beispiele, wie du das Aussehen der Blog Seite mit Hilfe der Templates anpassen kannst.
Inhaltsverzeichnis der Artikelserie:
- Teil 1 – Theme Optionen & Theme Customizer
- Teil 2 – Eigenes CSS und Browser Entwicklertools
- Teil 3 – Eigene Shortcodes erstellen mit Plugin Post Snippets
- Teil 4 – WordPress Child Theme erstellen mit Plugin
- Teil 5 – WordPress Templates bearbeiten & verstehen
- Teil 6 – WordPress Page Template erstellen
- Teil 7 – WordPress Hooks verstehen und anwenden
Was sind WordPress Templates bzw. WordPress Template Dateien?
Viele Einsteiger aber auch erfahrene WordPress User verwechseln gerne WordPress Templates mit WordPress Themes oder verwenden die beiden Begriffe als Synonym. Zum einen ist der Begriff „Themes“ nicht jedem Einsteiger sofort geläufig, zum anderen ist das Wort „Template“ irreführend, welches im Deutschen als Vorlage übersetzt wird. Die Annahme, dass es sich sowohl bei den Templates als auch bei den Themes um Vorlagen handeln muss, ist korrekt. Dennoch gibt es einen entscheidenden Unterschied zwischen Themes und Templates.
[vorsicht]Bevor du die WordPress Template Dateien bearbeitest, solltest du unbedingt ein WordPress Child Theme erstellen, entweder mit Plugin oder ohne Plugin![/vorsicht]
Was ist der Unterschied zwischen WordPress Themes und WordPress Templates?
Vereinfacht gesagt handelt es sich bei WordPress Themes um Design-Vorlagen für den gesamten Website-Auftritt und bei WordPress Templates um Design-Vorlagen für einzelne Website-Elemente oder Unterseiten. Die WordPress Template Dateien sind also PHP-Dateien, aus denen die WordPress Themes bestehen. Ein guter Startpunkt, um sich mit den WordPress Template Dateien vertraut zu machen, ist das offizielle Theme Handbuch.
Die Tatsache, dass der Begriff Template in WordPress in verschiedenen Zusammenhängen verwendet wird, trägt weiter zur Verwirrung bei. Man unterscheidet zwischen den folgenden Templates:
Page Templates – Die Page Templates sind Layout-Vorlagen, die ausschließlich das Aussehen der „Seiten“ bestimmen. Im nächsten Beitrag dieser Artikelserie werden wir uns diese Art von Templates genauer ansehen.
Beispiel für Page Template: page-kontakt.php
Post Templates – Die Post Templates sind noch relativ neu in WordPress (seit Version 4.8). Damit kann das Aussehen von „Beiträgen“ ähnlich wie bei den „Seiten“ beeinflusst werden. Auch diese sind Teil des nächsten Artikels.
Beispiel für Post Template: post-fullwidth.php
Post Type Templates – Was mit Posts und Pages geht, geht natürlich auch mit anderen benutzerdefinierten Inhaltstypen (Post Types).
Beispiel für Post Type Template: portfolio.php
Template Tags – Template Tags sind Code-Schnipsel, die WordPress auffordern, entweder Inhalte aus der Datenbank zu holen oder andere Theme Dateien zu laden.
Beispiel für Template Tag: get_footer()
Template Partials – Die WordPress Themes enthalten i. d. R. auch Vorlagen für Teile einer Webseite. Die sog. Template Partials sind damit Bestandteile anderer Templates, wie Page Templates. Damit kann z. B. die Seitenleiste (Sidebar) nur an einer Stelle geändert werden und muss nicht auf jeder Unterseite, die eine Seitenleiste enthält, angepasst werden.
Beispiel für Template Partials: sidebar.php
Beispiel für WordPress Templates
Fügen wir an dieser Stelle noch ein Beispiel hinzu, damit der Unterschied zwischen den verschiedenen Template Arten hoffentlich klarer wird. Wenn ich z. B. die page.php Datei öffne und in diese Datei die Funktion get_header() eintrage, sage ich WordPress damit, dass an dieser Stelle die Datei header.php Datei eingetragen werden soll. In diesem kleinen Beispiel ist die page.php Datei ein Page Template, die Funktion get_header() ein Template Tag und die Datei header.php ein Template Partial.
Template Hierarchie
Je nachdem welche Inhalte vom User angefragt werden, entscheidet WordPress anhand der Template Hierarchie, welches Template für die Anzeige herangezogen werden soll.
Beispiel: Wie WordPress die Template Hierarchie nutzt, um Inhalte anzuzeigen?
Das Template „singular.php“ wird z. B. verwendet, wenn die Einzelansicht eines Beitrags angezeigt werden soll und das Template „single.php“ in dem aktiven WordPress Theme nicht vorhanden ist. Die „singular.php“-Datei wird aber ebenfalls für die Anzeige einer (Unter-)Seite verwendet, wenn das jeweilige WordPress Theme die „page.php“-Datei nicht enthält.
Sollte das Template „singular.php“ auch nicht im Theme vorhanden sein, wird die „index.php“-Datei für die Anzeige verwendet. Das ist auch der Grund, warum jedes WordPress Theme aus mindestens 2 Dateien bestehen muss: index.php und style.css.
Und weil ich finde, dass man ein Thema am besten anhand von Beispielen erklärt, hier noch eine Folie aus meiner WordPress Schulung, an der die Verwendung der verschiedenen Templates an Beispiel von 3 Unterseiten gezeigt wird.
Es handelt sich hierbei wirklich nur um ein Beispiel, da die Startseite z. B. auch das Template home.php oder die Kontaktseite auch das Template page-24.php verwenden könnte, wobei die Zahl 24 dann für die Seiten-ID stehen würde.
Wie du herausfinden kannst, welches WordPress Template du bearbeiten musst?
Speziell bei größeren Themes kann es schwierig sein, das richtige Template zu finden, welches bearbeitet werden muss. Das Plugin Show Current Template zeigt dir immer das Template an, welches die aktuell betrachtete Seite verwendet.
[vorsicht]Wenn du die Template Dateien in deinen Child Theme Ordner kopierst ist es wichtig, dass die Ordner-Struktur im Child Theme mit der Ordner-Struktur vom Parent Theme übereinstimmt.[/vorsicht]
Wie du die Ordner Struktur richtig in dein Child Theme übernimmst, erfährst du ebenfalls im folgenden Video.
WordPress Templates bearbeiten am Beispiel der Blog Seite
Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.
Mehr erfahren
WordPress Templates berarbeiten anhand von 2 Beispielen und Vorstellung der WordPress Template Hierarchie.
YouTube Kanal von WPC abonnieren und keine Tutorials mehr verpassen!
Nach einer kurzen Einführung in die Welt der Templates auch anhand der Template Hierarchie, stelle ich dir in diesem Video Tutorial zwei Beispiele vor, um WordPress Templates zu bearbeiten:
Beispiel 1: Auf der Blog Seite nur einen Auszug der Beiträge (Excerpt) oder den kompletten Beitragsinhalt darstellen
Möchtest du die Inhalte auf deiner Blog Seite anders darstellen? Im Video zeige ich dir anhand des Twentyseventeen Themes, wie du die Beiträge mit komplettem Inhalt oder nur mit einem kurzen Auszug darstellen kannst.
Beispiel 2: Vorschaubild der Beiträge auf der Blog Seite anzeigen lassen
Zeigt dein Theme auf der Blog Seite nicht die Vorschaubilder an? Kein Problem, mit ein wenig Copy/Paste in das richtige Template kannst du die Vorschaubilder in jedem Theme anzeigen.
Fazit
Auch wenn sich dieser Beitrag an fortgeschrittene WordPress User richtet, ist es doch erstaunlich, wie einfach man jedes WordPress Theme anpassen kann, sobald man sich ein wenig mit den Template Dateien beschäftigt. Wenn also dein favorisiertes WordPress Theme eine bestimmte Einstellung nicht anbietet und du etwas Zeit und Geduld aufbringen kannst, lohnt sich ein Blick auf die Templates. Zumindest bevor du einen teuren WordPress Entwickler mit der Anpassung deiner Website beauftragst.
Ausblick auf Teil 6
Im nächsten Artikel werden wir uns die Page Templates im Detail ansehen. Damit lassen sich verschiedene Seitenlayouts realisieren, wie z. B. ein Layout über die volle Breite oder das Ausblenden bestimmter Template Partials wie den Header, womit man ebenfalls ein neues Design für die Unterseite erhält.
[stay id=“3539″]
6 Antworten
Hallo Danijel,
ich habe eine zeitlang für Blogartikel Template benutzt und in den Artikel mit dem elemetor-template id-Code eingefügt. Leider ist beim letzten Mal ein fataler Fehler aufgetreten, der dazu führte, dass meine website sich nur noch schwarz darstellte. Mein Techniker konnte Sie auch nur notdürftig wieder herstellen. Viele Funktionen klappen nicht mehr. Haben Sie eine Idee, was man machen kann?
viele Grüsse
Lis
Hallo Lis,
ohne mir die Seite anzusehen, ist es natürlich schwer die Fehlerursache zu erkennen. Ich habe auch nicht ganz verstanden, was Du mit elementor template id-Code meinst? Meinst Du den Shortcode (in eckigen Klammern)? Und welches Template hast Du für Deine Blogartikel verwendet? In der Regel gibt es in WordPress zwei Lösungsansätze, die bei Fehlern ganz gut funktionieren: Entweder Plugins deaktivieren (ist in diesem Fall wahrscheinlich nicht die Fehlerursache) oder das Standard-Theme aktivieren. In Deinem Fall würde ich Dir empfehlen, ein WordPress Default Theme (2020 oder 2021) zu aktivieren (entweder über den WordPress Adminbereich oder über FTP), um zu sehen, ob der Fehler damit behoben werden kann bzw. um das Theme als Fehlerursache auszuschließen.
Aber wie gesagt, man müsste sich wahrscheinlich die Seite genauer ansehen, um den Fehler zu finden.
Schöne Grüße, Danijel
Hallo Danijel,
super Blog-Beitrag! Vielen Dank dafür. Ich habe nur das Problem, dass ich etwas an einem bestimmten Abschnitt auf einer Seite ändern möchte, der über einen Shortcode eingefügt wurde. Das Plugin zeigt mir auf der Seite neben full-width.php noch weit über 100 anderen Templates an und ich weiß nicht, wie ich das Template für diesen speziellen Abschnitt herausfinde. Kannst du mir da weiterhelfen?
Hallo Lisa,
danke für dein nettes Feedback!
Generell kann man sagen, dass man die Templates von einem Plugin nicht ändern sollte. Da es sowas wie ein „Child-Plugin“ nicht gibt, wären alle Änderungen an Plugin Templates nach dem nächsten Update wieder verschwunden. Vielleicht kannst du die URL deiner Seite hier posten und sagen, welchen Bereich du anpassen möchtest und welches Plugin du für den Shortcode verwendest. Dann kann ich einen Blick darauf werfen.
Schöne Grüße, Danijel
ich bin alt und Anfänger bei WordPress (org) und habe mich darüber sehr gefreut, dass grundlegende Unterschiede zwischen den Begriffen „Themes“ und „Templates“ für mich in Ansätzen erklärt und dessen Unterscheidung verdeutlicht wurde, von child-Themes für Header und dessen konkreter Nutzung für mich in frühestens ca. 4 Wochen einmal abgesehen …
Ich bin nun gut 60 Jahre alt und möchte meine alte Frontpage-/Expression Web 4 Version endlich auf php anpassen, bevor ich musikalisch in die Kiste gehe… Vielen Dank Harald Richter – behaja
Vielen Dank für diesen schönen Kommentar 🙂
Ich finde es toll, wenn sich Leute im fortgeschrittenen Alter auch mit neuen Technologien beschäftigen.
…und immer an das Udo Jürgens Lied denken: Mit 66 Jahren, da fängt das Leben an… Würde bedeuten, erst in 6 Jahren 🙂
Schöne Grüße und viel Erfolg, Danijel