Wenn du mit WordPress arbeitest wirst du sicher irgendwann an einen Punkt kommen, an dem du auf Child Theme oder Plugin treffen wirst. Hier kommt dann meistens die Frage auf, wie man diese oder kleinere “Snippets” einbauen soll. Hier gibt es grundsätzlich 3 beliebte Vorgehensweisen. Einmal das direkte Ändern in der functions.php – die aber immer nur in einem Child Theme geändert werden sollte. Dann das Erstellen und Einbinden eines eigenen PlugIns. Oder entsprechende Snippets über ein PlugIn hinzufügen. Schauen wir uns das einfach mal an…
Was ist ein Child-Theme?
Es gibt viele Internet-Seiten die bis ins kleinste Detail erklären was genau ein Child-Theme ist, wie es aufgebaut werden kann und wozu es überhaupt gut ist. Ich werde versuchen es einfach kurz zu halten und die für uns wichtigen Informationen zusammen zu tragen.
WordPress arbeitet mit sogenannten “Themes” – bei mir siehst du zum Beispiel das Theme GeneratePress – diese sorgen dafür dass deine Seite so aussieht wie sie halt aussieht und natürlich noch viel mehr :-)
In diesen Paketen findest du viele einzelne Dateien – unter anderem die schon erwähnte functions.php. Im Internet gibt es viele Anleitungen die dir erklären wie du Snippets in diese einbauen sollst. Das Problem dabei: sobald es für dein Theme ein Update gibt, sind alle deine Änderungen wieder weg.
Und das gleicht einer Katastrophe… denn du wirst sicher irgendwann nicht mehr genau wissen was du wie und wo eingebaut hast.
Und hier kommt jetzt dieses Child-Theme zum Einsatz. Dieses ist so etwas wie eine “bei Bedarf angewandte Kopie”.
Im Prinzip sagst du einmal dem Child von wem er das Kind ist… Also Parent Theme – was in meinem Fall GeneratePress wäre.
Und verschiebst dann einfach die Datei, an der du Änderungen vornehmen möchtest, in den Ordner von den Child-Theme.
Somit bleibt das Parent-Theme unberührt und du kannst ohne Risiko an css-Dateien, functions.php usw. arbeiten.
Wir erstellen uns ein Child-Theme
Wie bereits erwähnt ist dies ja eine Art Kopie. Daher benötigen wir jetzt erst einmal einen Zugang zu unserem Webserver.
Dafür nehmen wir das Programm Filezilla und verbinden uns mit SFTP auf den Server. Dafür benötigst du die Daten deines Anbieters/Provider:
- Server-Name (IP)
- (S)FTP-User
- (S)FTP-Passwort
Sobald du dich verbunden hast wechselst du in das Verzeichnis /wp-content/themes. Hier liegen deine installierten Themes.
In meinem Beispiel werde ich ein Child für GeneratePress erstellen. Daher legen wir nun einen neuen Ordner an, den wir generatepress_child nennen.
In diesem erstellen wir jetzt eine Datei mit Namen style.css und füllen sie mit ein paar Kommentaren: Diese kannst du im Prinzip so übernehmen, bzw mit dem Namen deines Parent-Themes anpassen.
/* Theme Name: GeneratePress Child Theme URI: https://generatepress.com Description: Default GeneratePress child theme Author: Tom Usborne Author URI: https://tomusborne.com Template: generatepress Version: 0.1 */
Als nächste Datei legen wir die functions.php in unserem Child-Ordner an. Auch hier fügen wir nur ein paar Kommentare ein.
/** * GeneratePress child theme functions and definitions. * * Add your custom PHP in this file. * Only edit this file if you have direct access to it on your server (to fix errors if they happen). */
Das war es hier soweit auch schon. Du könntest noch ein Bild im png-Format hochladen damit du es später in der Theme-Übersicht direkt erkennst. Ich verzichte auf dieses.
Falls du bei deinem eigenen Theme (Parent) schon Änderungen über den Customizer getätigt hast, kann es gut sein, dass diese bei der Aktivierung des Child-Themes verloren gehen. Wenn du weiter nichts eingerichtet hast dann kannst du den nächsten Tipp überspringen.
Änderungen über den Optimizer vor der Umstellung sichern
Hier hilft dir ein PlugIn sehr gut weiter. Mit Customizer Export/Import kannst du deine Änderungen, die du über die Customizer-Funktion getätigt hast, ganz einfach sichern und später wieder in dein Child-Theme übernehmen. Nach der Installation findest du unter Themes – Customizer ganz unten einen neuen Menüpunkt Export/Import. Dort kannst du dann deine Einstellungen exportieren und später importieren.
Child-Theme aktivieren und nur noch hier Änderungen vornhemen
Jetzt kannst du auf deiner Seite im Admin-Bereich über Design-Themes dein neu erstelltes Child-Theme aktivieren und falls notwendig über den Customizer Import deine vorher exportierten Einstellungen einlesen.
Alle Änderungen führst du ab jetzt nur noch in dem Child-Theme durch. Aktuell haben wir ja bereits eine style.css und die functions.php erstellt.
Die meisten Anleitungen für Snippets beziehen sich auf die functions.php.
Ein Vorteil ist hier definitiv das Updates bei deinem Parent-Theme keinen Einfluss auf deine Änderungen in dem Child-Themen haben. Sie gehen also nicht verloren.
Erweiterungen / Änderungen über ein PlugIn
Größere Änderungen bzw. Funktionen werden meistens über ein PlugIn hinzugefügt. Die meisten findet man wohl bei wordpress direkt.
Installieren geht recht einfach. Entweder direkt über deine WordPress-Admin Seite im Bereich “PlugIns” oder man lädt sich über wordpress das PlugIn herunter und via Filezilla auf seinen Webserver nach wp-content/plugins.
Du kannst dir aber auch dein eigenes PlugIn erstellen.
Anhand eines einfachen Beispiel zeige ich dir wie du das am besten anstellen kannst.
Unser eigenes PlugIn
Wir brauchen einen ssh- oder SFTP-Zugang. Also zum Beispiel wieder FileZilla oder Putty.
Mit diesem verbinden wir uns mit dem Webserver und hangeln uns in das Verzeichnis “wp-content/plugins/”
Hier erstellen wir uns einen neuen Ordner mit Namen “redirect” und in diesem die Datei “redirect.php”.
Diese füllen wir mit folgendem Inhalt:
<?php
/*
* Plugin Name: redirect test
* Plugin URI:
* Description:
* Version: 1.0
* Author:
* Author URI:
*/
if ( ! function_exists( 'dwc_wrong_login_redirect' ) ) :
/**
* Nach falschem Login Weiterleitung auf andere Seite, hier google.de
*/
function dwc_wrong_login_redirect() {
wp_redirect( 'https://www.google.de' );
exit;
}
add_filter( 'login_errors', 'dwc_wrong_login_redirect' );
endif;
?>
Das ganze speichern wir und aktivieren unser eigenes PlugIn über die Admin-Konsole “Plugins”-“Installierte PlugIns” und suchen “redirect test”:
Und das war auch schon alles. Jetzt ist unser “redirect”-PlugIn einsatzbereit. Du kannst es testen indem du versuchst dich mit einem falschen LogIn einzuloggen. Sollte alles geklappt haben, wirst du auf google.de weitergeleitet.
Im Grunde kannst du fast jedes Snippet so bei dir einbauen und sparst dir die Änderungen in der functions.php.
Code / Snippets über ein PlugIn einfügen
Eine weitere Möglichkeit Snippets einzubauen ist über ein PlugIn. Ich selbst nutze CodeSnippets bei meinen Umgebungen, baue manche allerdings auch gerne direkt als eigenes PlugIn ein.
Du kannst hier (endlich) zwischen einer kostenlosen CodeSnippets Version und der neuen und wirklich genialen CodeSnippets Pro Version wählen.
Es gibt zwar einige nützliche Funktionen in der Pro-Variante, ich habe diese allerdings in erster Linie gekauft um die Entwickler zu unterstützen.
Denn das PlugIn ist es einfach wert und erleichtert einem soooo sehr das “schnell mal was testen”.
Nachdem du CodeSnippets installiert hast, findest du im Admin-Bereich einen neuen Eintrag “Snippets”. Dort kannst du neue Snippets hinzufügen und vorhandene verwalten / deaktivieren.
Im Grunde kannst du alle Snippets, die du ansonsten in die functions.php eintragen sollst, ab jetzt hierüber hinzufügen. Dies ist besonders praktisch, da du so zum einen den Überblick besser behältst und zum anderen einzelne einfach wieder deaktivieren kannst.
Lass uns mal fix ein Snippet zusammen installieren.
Dazu gehst du im Bereich “Snippets” auf “Neu hinzufügen”.
Jetzt kannst du einen Titel vergeben – so findest du einzelne Snippets schnell wieder.
Im Bereich “Code” kommt jetzt der eigentliche Code hinein:
if ( ! function_exists( 'dwc_wrong_login_redirect' ) ) :
/**
* Nach falscher Login Weiterleitung auf andere Seite, hier google.de
*/
function dwc_wrong_login_redirect() {
wp_redirect( 'https://www.google.de' );
exit;
}
add_filter( 'login_errors', 'dwc_wrong_login_redirect' );
endif;
?>
“Snippets überall ausführen” ist standardmäßig aktiviert und kann meistens auch so bleiben. Über den Bereich “Beschreibung” und “Schlagwörter” kannst du dich austoben um deine Massen an Snippets zu kategorisieren und Erklärungen hinzuzufügen.
Mit “Speichere Änderungen und aktiviere” machst du was?! Genau! Speicherst und aktivierst dein Snippet.
Wenn du mit dem oberen aktivierten Beispiel jetzt versuchst dich mit einem falschen Passwort einzuloggen, wirst du auf google.de weitergeleitet.
Das Snippet kannst du in der Übersicht ganz einfach wieder deaktivieren.
Es ist ein wirklich sehr nützliches Tool. Allerdings sollte man im Hinterkopf behalten, dass alle Änderungen in die Datenbank geschrieben und natürlich auch wieder eingelesen werden. Hier könnte natürlich ein böser Geselle, durch eine Sicherheitslücke, Schadcode in die Datenbank werfen und starten…
Hier musst du einfach selbst entscheiden. Auch bei normalen PlugIns kann es Sicherheitsbedenken geben.