Ich hoffe du hattest einen guten Start in das neue Jahr. Wie du sicherlich gemerkt hast, habe ich das letzte Jahr sehr ruhig – eventuell sogar zu ruhig – ausklingen lassen. Aus diesem Grund möchte ich heute ein sehr interessantes Thema angehen: WordPress Child Themes.
Einige kennen sich sicher schon damit aus, viele werden es aber zum ersten mal hören, also fange ich mal ganz vorne an.
Was ist ein WordPress Child Theme?
Das Problem mit einem schönen WordPress Theme ist doch folgendes, es kann noch so gut sein, am Ende ist es aber nie perfekt für den eigenen Nutzen, es sei denn man hat das nötige Kleingeld in eine professionell erstellte WordPress Website nach Wunsch investiert.
Was daraus folgt? Man fängt an daran rumzuschrauben, hier ein wenig Code raus, da ein wenig Code rein, H1 wird hier H2 und so weiter. Dann kommt der Tag an dem der Ersteller des Original Themes ein Update bereitstellt, schnell auf Update geklickt und zack alle eigenen Änderungen sind dahin.
Das ist der Punkt an dem ein Child Theme ist Spiel kommt, alle Änderungen die du nach der Installation deines Themes hinzufügst, bleiben auch bei späteren Updates erhalten, sehr praktisch wie ich finde, denn dein Child Theme stellt nur die Sachen des “Main” / Parent Themes dar, die du nicht im Child Theme verändert hast. Ich persönlich nutze diese sehr häufig, allerdings ist es nicht ganz so leicht umzusetzen, aber sieh selbst.
Conversion-Plugins: Flytools  | Vorteile:  |
 |
Ab in den Code
Ich versuche die Erstellung eines Child Themes so einfach wie möglich zu erklären, sollten sich trotzdem Fragen ergeben, kannst du in den Kommentaren natürlich jederzeit gerne Fragen stellen.
1. Die Vorbereitungen
Leg einen Ordner in deinem WordPress Theme Verzeichnis an. Dieses findest du indem du ein FTP Programm zur Hand nimmst, dann in dein Blog Hauptverzeichnis manövrierst und dort folgende Ordner aufsuchst:
1 | /dein_blog/wp-content/themes/ |
Dort legst du einen neuen Ordner an mit dem Namen deines geplanten Child Themes. Der WordPress Codex empfiehlt hier den Namen deines Parent Themes zu nehmen und es mit einem “-child” zu versehen.
Im Prinzip kannst du es aber nennen wie du willst. Leerzeichen solltest du allerdings vermeiden, einige Sonderzeichen natürlich auch.
2. Ein wenig Code
In deinem neuen Ordner legst du nun eine neue Datei an und zwar eine Datei mit dem Namen style.css, dieses mal muss diese Datei auch genau so heißen. Dein Pfad sollte also nachher etwa so aussehen:
1 | /dein_blog/wp-content/themes/parentthemename-child/style.css |
Diese style.css sollte dann in etwa so aussehen, wie im Code den du ein paar Zeilen tiefer siehst. Wichtig ist eigentlich nur die Zeile 7 – “Template: …”! Dort sollte exakt der Ordner stehen, der dein Parent Theme beinhaltet.
Alle anderen Änderungen kannst du ganz frei bestimmen, also der Theme Name, die URI, die Description und so weiter sind vollkommen beliebig.
1 2 3 4 5 6 7 8 9 10 11 12 | /* Theme Name: Twenty Fourteen Child Theme URI: http://example.com/twenty-fourteen-child/ Description: Twenty Fourteen Child Theme Author: John Doe Author URI: http://example.com Template: twentyfourteen Version: 1.0.0 Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready Text Domain: twenty-fourteen-child */ /*Füge deinen Code unter dieser Zeile ein. Nutze gegebenenfalls !important, um Styles aus dem Haupt-Theme zu überschreiben.*/ |
Nun musst du nur noch eine Datei mit dem Namen functions.php erstellen. Diese wird nun durch folgenden Code mit der CSS Datei des Haupt-Themes verknüpft. Dazu kommt folgender Code in die functions.php:
1 2 3 4 5 | <?php //add child theme add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' ); function theme_enqueue_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' ); } ?> |
Wenn du alles richtig gemacht hab, solltest du jetzt under Design -> Themes in deinem WordPress Backend ein neues Theme zur Auswahl haben.
3. Weitere Änderungen
Bis jetzt hast du ja nur eine neue style.css angelegt, fügst du hier Änderungen ein, wird automatisch die Funktion der Parent Themes überschrieben oder eher überlagert. Änderst du also etwas, ändert sich auch dein Theme, wobei im Parent Theme natürlich nichts geändert wird. Schreibst du hier also eine Zeile in deine neue style.css, wird diese Zeile angezeigt und nicht die äquivalente in dem Parent Theme.
Natürlich kannst du auch andere Dateien ändern, hier solltest du aber beachten, dass die *.php Dateien die du anlegst ausgeführt werden, nicht mehr die des Parent Themes. Es bietet sich also an die Datei erst einmal zu kopieren, dann in dem Child Theme einfügen und dort dann zu verändern, schon alleine weil die Datei die du überschreiben willst, sowohl im Parent-, als auch im Child Theme, gleich heißen muss.
Eine Ausnahme stellt die function.php dar, diese überschreibt die Parent Datei nicht, sondern wird zusätzlich geladen.
Fazit
Ein WordPress Child Theme ist wirklich eine schöne Sache, vor allem wenn man wirklich Veränderungen an dem Theme vornehmen will, die sich nicht mit einem Klick nach einem Update wieder herstellen lassen und gleichzeitig aber auf Updates nicht verzichten will.
Wie du gesehen hast,ist die Sache auch nicht so aufwendig, natürlich ist sie nicht ohne Arbeit verbunden, aber einmal gemacht spart man sich im Nachhinein doch einiges an Ärger mit den Updates.
Eine Bitte hätte ich aber noch: Wenn du anfängst mit deinem FTP oder im Code zu arbeiten, mach bitte ein Backup. Hier können sich jederzeit Fehler einschleichen, Fakten können sich ändern und so weiter. Ein Backup ist also immer eine gute Idee, bevor man solche Sachen angeht!
Loading...
Ein Kommentar zu WordPress Child Theme erstellen: Eine Anleitung für blutige Anfänger!