Website-Icon The Magical Digital Nomad

Wie kann ich mir ein eigenes Seitentemplate in WordPress anlegen?

WordPress Theme erweitern und programmieren

WordPress Theme erweitern und programmieren

Gerade wieder im Netz auf eine Frage gestoßen, die für viele ein Mysterium ist, aber für WordPress-Profis so was von selbstverständlich ist. „Kann mir hier vielleicht jemand sagen, ob ich in WordPress auch Seiten erstellen kann, deren Titel NICHT angezeigt wird?“ Und auch die Antwort ist dann so was von klar: „Könnte man doch aber wohl über ein Childtheme ganz rausnehmen oder per CSS ausblenden.“ Aber gerade mit dem (CSS? php? Page?), haben dann die meisten BloggerInnen Probleme. Da sind dann nur mehr große Fragezeichen zu sehen. Doch es kann ja so einfach sein, wenn ein Profi es auch einfach erklären kann.

Ich würde es weder über CSS noch irgendwas in diese Richtung lösen. Meine Gedanken bewegen sich da in Richtung einer eigenen Vorlage einem sogenannten Page-Template. Um auf der sicheren Seite zu sein, solltest du dir ein Child-Theme erstellen und danach können wir schnell und einfach loslegen. Wenn du jeden Schritt befolgst klappt es auch. Und wenn du Fragen hast (die haben die meisten und trauen sich nur nicht es hier zu schreiben), dann sei mutig und schreib einen Kommentar.

1. Die ursprüngliche Seite kopieren

Suche dir im Eltern-Theme die Datei page.php und kopiere sie 1:1 in dein Child-Theme. Erstens bist du dann sicher, dass die Originaldatei nicht verändert wird und auch weiter zur Verfügung steht. Zweitens kannst du dann jederzeit Updates durchführen, ohne dass deine Änderungen gelöscht werden. Dazu lädst du sie mit einem FTP-Programm vom Eltern-Theme auf deinen Computer und danach sofort wieder auf den Server. Aber beim Hochladen achtest du darauf, dass sie im Child-Theme landet und nicht dort wo du sie heruntergeladen hast.

Nun musst du der Datei einen neuen Namen geben. Bei FileZilla klickst du mit der rechten Maustaste auf die Datei und wählst den Befehl Umbenennen. FileZilla zeigt dir jetzt den Dateinamen editierbar an und du gibst jetzt einen passenden Namen ein. Aber er darf keine Leer- oder Sonderzeichen enthalten. Am besten verwendest du nur die Buchstaben von A – Z oder a – Z, die Ziffern 0 – 9 und den Binde- oder Unterstrich (-, _) für den Dateinamen, dann bist du auf der sicheren Seite.

2. Dem Template einen Namen geben

Dazu musst du jetzt direkt den Code deiner neuen Seitenvorlage ändern. Dazu klickst du wieder mit der rechten Maustaste auf den Dateiname. Aber dieses Mal verwendest du den Befehl Ansehen/Bearbeiten aus dem Kontextmenü. Jetzt sollte sich irgendein Editor deines Computers öffnen. Meistens wird das auf Windows NotePad und auf Mac TextEdit sein. Beide können dir Sorgen bereiten (sie könnten formatierten Text speichern), daher empfehle ich dir Sublime Text 3. Lade den Editor schnell herunter und verwende ihn für die folgenden Änderungen. Damit sparst du dir einfach viel Ärger bei der Fehlersuche.

Du siehst jetzt den gesamten Quellcode der Datei vor dir. Der schaut natürlich von Theme zu Theme unterschiedlich aus. Aber meistens findest du, wie hier gezeigt, eine Bemerkung am Anfang der Datei (Ich habe dir mal die vom Standardtheme Twenty Nineteen kopiert). Natürlich ist der gesamte Quellcode der page.php länger, nur für unser Ziel reichen die ersten paar Zeilen.

<?php
/**
 * The template for displaying all single posts
 *
 * @link https://developer.wordpress.org/themes/basics/template-hierarchy/#single-post
 *
 * @package WordPress
 * @subpackage Twenty_Nineteen
 * @since 1.0.0
 */

get_header();
?>

Für uns ist jetzt die Zeile #2 interessant. Direkt danach fügst du eine Leerzeile ein und am Anfang eine Leerzeichen einen Stern und wieder ein Leerzeichen.  Danach schreibst du den Text Template Name: und nach dem Doppelpunkt ein Leerzeichen und direkt dahinter einen Namen für deine Vorlage. So etwas wie Seite ohne Titel. Dann sollte der Bemerkungsblock am Anfang des Seitentemplates so aussehen:

<?php
/**
 * Template Name: Seite ohne Titel
 * Standardseite, es wird nur kein Titel angezeigt
 *
 * @link https://developer.wordpress.org/themes/basics/template-hierarchy/#single-post
 *
 * @package WordPress
 * @subpackage Twenty_Nineteen
 * @since 1.0.0
 */

get_header();
?>

Ich habe auch noch den Text in der 4. Zeile angepasst. Damit ist mir auch in Zukunft klar, was diese Vorlage macht.

3. Den Titel der Seite entfernen

Damit du nun auch keinen Titel mehr siehst, musst du eine bestimmte Zeile im Code finden.

<h2 class="entry-title"><?php the_title(); ?></h2>

Sie wird so oder zumindest so ähnlich aussehen. Auf jeden Fall wird der WordPress-Befehl the_title() zu finden sein. Lösche einfach die Zeile mit dem beiden HTML-Tags (<h2>und </h2>) weg. Natürlich kannst du hier auch alles andere ändern. Aber wenn du nicht so gut in php bist, sei bitte vorsichtig. Am Besten änderst du immer nur eine Zeile, speicherst die Datei ab und probierst die Änderungen in deinem Blog aus. Sobald du eine weiße Seite bekommst, hast du etwas falsch gemacht. Dann machst du einfach den letzten Arbeitsschritt rückgängig, speicherst und alles klappt wieder.

4. Die Datei speichern

Das ist nun das Einfachste an der ganzen Übung: Du speicherst wie üblich deine Datei, dein Page-Template ab, aber eine Kleinigkeit gibt es danach zu beachten. Du musst nach dem Speichern FileZilla aktivieren. Du bemerkst sofort ein Fenster, welches dich warnt, dass eine Datei auf den WebServer übertragen und auch überschrieben wird. Bestätige die Aufforderung mit Ja damit du danach das Template auf dem Server speicherst.

5. Das Template verwenden

Jetzt, da du alles erledigt hast, kannst die neue Vorlage auch aktivieren. Dazu gehst du im DashBoard von WordPress auf Seite bearbeiten um eine bestehende Seite zu ändern oder auf Erstellen um eine neue Seite anzulegen. Eigentlich solltest du in der rechten Seitenleiste ein Widget mit dem Namen Attribute finden. Falls es nicht da ist, klickst du auf die drei Punkte rechts oben und im dem Menü ganz unten auf Ansicht anpassen. Und in der neuen Liste hakst du einfach Seitenattribute an. Dann hast du auch diesen Block am rechten Seitenrand.

Nun kannst du auch deine Vorlage aktivieren. Klappe dazu die Liste unter Template auf und wähle die Vorlage Seite ohne Titel aus, oder was du nach dem Template Name: eingegeben hast. Sobald du nun deine Seite speicherst, wird sie im FrontEnd mit deiner neuen Vorlage verwenden. Und so schwierig war es jetzt wirklich nicht, oder?

Die mobile Version verlassen