Divi Theme - 10% OFF

Erhalte 10% Rabatt auf das meistverkaufte WordPress Theme.

Divi Theme - Cyber Monday Sale

Das meistverkaufte WordPress Theme!

Tage
Stunden
Minuten
Sekunden

So erstellst du ein Child Theme mit WordPress

WordPress Child Theme erstellen - Tutorial Titelbild
Zuletzt aktualisiert: 21. Januar 2021

Nutzerbewertungen

4.5/5 – (15 votes)

In dieser Anleitung erkläre ich dir was ein Child Theme ist bzw. wofür es nützlich ist und zeige dir wie du ein Child Theme ganz einfach erstellst, ohne dabei in den Theme Dateien arbeiten zu müssen.

Inhaltsverzeichnis

Was ist ein Child Theme?

Ein Child Theme ist eine untergeordnete Kopie deines installierten WordPress Themes (Parent Theme), welches parallel dazu installiert wird.

Somit hast du praktisch zwei gleiche Themes zur selben Zeit aktiviert. Hierbei vererbt das Parent- oder auch “Eltern”-Theme sämtliche Funktionen und das Design an das Child- oder auch “Kind” Theme.

Ein solches untergeordnetes Thema ist nützlich, um ein vorhandenes Theme anzupassen.

Wozu brauche ich ein Child Theme?

Grund hierfür ist, dass deine Änderungen nach einer Theme Aktualisierung nicht verloren gehen. Denn nach jedem Theme Update werden alle Theme Dateien überschrieben.

Wenn du also Anpassungen an den Theme Funktionen oder beispielsweise zusätzlichen CSS Code hinzufügen möchtest, empfehle ich dir also ein Child-Theme zu verwenden.

Natürlich kannst du dir separat aufschreiben, welche Änderungen wo vorgenommen hast und diese nach jedem Update neu eingeben.

Das ist allerdings sehr zeitaufwendig und nicht sonderlich professionell.

Wie erstelle ich ein Child Theme?

Im Folgenden zeige ich dir, wie du mit dem kostenlosen PlugIn “Child Theme Configurator” ganz einfach ein Child Theme erzeugen kannst.

Los geht’s!

1. Logge dich in das WordPress Dashboard deiner Website ein.

2. PlugIns > Installieren

3. Suche: “Child Theme Configurator

4. Klicke auf den Button: “Jetzt installieren” und anschließend auf “Aktivieren”

Das kostenlose WordPress PlugIn "Child Theme Configurator"

5. Gehe auf Einstellung: Werkzeuge > Kindthemen

Menü - Werkzeuge und Child Theme

6. Wähle das Theme aus. (In meinem Fall das kostenlose Sydney Theme)

Child Theme Configurator - Parent Theme auswählen

7. Belasse alle Standardeinstellungen außer unter Punkt Nummer 8 Setze einen Haken, um auch deine erstellten Widgets etc. in das Child Theme zu kopieren.

Child Theme Configurator - Einstellungen

8. Klicke auf “Configure Child Theme” um das Child Theme zu erzeugen.

9.Gehe auf die Einstellung: Design > Themes

WordPress Theme Auswahl - Child Theme

10. Nun sollte hier ein weiteres Theme erscheinen mit dem Namen deines Themes und dem Zusatz “Child”. Aktiviere dieses!

11. Fertig! Du hast ein Child Theme deines Themes erstellt und erfolgreich aktiviert.

 

Nun kannst du deine Website anschauen und solltest keinen Unterschied erkennen!

Wie kann ich die Parent Theme-Dateien in das Child-Theme kopieren?

Jetzt zeige ich dir wie du Anpassungen im Child Theme vornehmen kannst und PHP Dateien aus deinem “Eltern” Theme in das Child Theme kopieren kannst.

1. Gehe auf die Einstellung: Design > Editor

2. Wähle oben bei “zu bearbeitendes Theme” das Child Theme aus. In meinem Fall “Sydney Child”

3. Standardmäßig sind bereits ein Stylesheet (style.css) sowie die Theme Funktionen (functions.php) vorhanden. Hier kannst du deine CSS Anpassungen bzw. deine PHP Funktionen einfügen.

Vorteil: Beim nächsten Theme Update bleiben alle deine Änderungen erhalten.

Editor Ansicht - vorher

Um nun weitere Dateien wie z.B. die footer.php und die header.php aus dem Parent Theme in das shadow2 Child Theme zu kopieren, um dort Änderungen vorzunehmen, gehst du wie folgt vor:

1. Gehe auf die Einstellung: Werkzeuge > Kindthema

2. Klicke auf den Reiter “Dateien

3. Wähle die Dateien aus, die du in das Child Theme kopieren möchtest. In meinem Fall die header.php und die footer.php

4. Klicke auf “Auswahl in das Kindthema kopieren

5. Fertig!

Child Them Configurator - Einstellungen - Dateien Reiter

Nun kannst du auch Änderungen an der header.php und der footer.php vornehmen, ohne dass diese beim nächsten Theme Update überschrieben wird!

Editor Ansicht - nachher

Übrigens kannst du das PlugIn „Child Theme Configurator“ nach der Erstellung des Child Themes wieder deaktivieren bzw. deinstallieren. Das Child Theme bleibt bestehen. 🙂

Fazit

Ein Child Theme ist unbedingt notwendig, damit Änderungen am Code nicht nach jedem Update wieder verloren gehen. Mit dem vorgestellten Plug-in „Child Theme Configurator“ lässt sich das super schnell und vorallem einfach umsetzen.

Ich hoffe ich konnte dir mit dieser Anleitung weiterhelfen!

Viel Spaß mit deinem neuen Child Theme!

Hat dir meine Anleitung gefallen? Dann gebe doch eine positive Bewertung 🙂

4.5/5 – (15 votes)

Oder empfehle ihn deinen besten Freunden! 😉

Starte jetzt mit deiner eigenen WordPress Website: zum WordPress Tutorial!

4.5/5 - (15 votes)
Patrick Ruh

Patrick Ruh

Im Jahr 2017 gründete er WP Wizard, um Selbstständigen und kleinen Unternehmen bei der Erstellung einer Webseite unter die Arme zu greifen. Er absolvierte seinen Master in Business Development, Produkt- und Start-up Management und studierte Internet Marketing, User Experience und Entrepreneurship in den USA. Seine Tutorials werden monatlich von mehreren Tausend Besuchern angeschaut und inzwischen von verschiedenen Universitäten, Hochschulen und Volkshochschulen genutzt, um in das Thema „WordPress“ einzuführen. Seit 2019 ist er Co-Founder und CMO bei timeBuzzer, einer Zeiterfassungslösung für Freiberufler und Unternehmen.

22 Kommentare

  • Hallo,

    nur zur 100%-igen Sicherheit:

    Der Child Theme Configurator darf – nach Erstellung und Aktivierung des Child – deaktiviert und anschließend gelöscht werden?
    Das Child Theme bleibt unversehrt?

    Danke für die Hilfe!

    Lg

    Antworten
  • Hallo Patrick,

    nach meinem 1. Fehlversuch ein Child-Theme zu erstellen (gemäß der dürftigen Anleitungen im Netz), bin ich total verunsichert und hier auf deiner Seite gelandet.

    Wenn ich bei Punkt 8 des Child Theme Configurators den Haken setze, dann bleiben neben meinen eigenen Widgets auch alle meine bereits erstellten und mit Text gefüllten Seiten vorhanden und sind dann alle im Child-Theme integriert? Ganz sicher? Das muss ich dann nur noch aktivieren? Sorry, aber ich bin absoluter Laie 🙁 und brauche hier dringend Hilfe.

    Antworten
    • Hallo Heike,
      wenn du der Anleitung Schritt für Schritt gefolgt bist, sollte alles genauso funktionieren, ja!
      Generell empfehlt sich aber immer ein Backup vorher zu machen. Beispielsweise mit Updraft.
      Beste Grüße Patrick

      Antworten
  • Hallo Patrick,
    …wie allen anderen, gefallen mir Deine Tutorials echt super!

    Bin gerade dabei Dein WP-Tutorial mit dem Sidney Theme durchzuarbeiten (lokal mit MAMP). Dazu musste ich mir das alte Theme sydney.1.41 runterladen, da bei dem aktuellen irgenwie alles anders funktioniert und mir optisch überhaupt nicht mehr gefällt.
    Soweit alles prima, bin jetzt bis zur Slider-Anpassung gekommen.
    Dann habe ich nach diesem Tutorial ein Child-Theme erstellt, das auch funktioniert
    …und mit UpdraftPlus glücklicherweise ein Backup gemacht ,-) , denn nach dem Update des Sydney Master-Themes sieht das Child-Theme jetzt auch genauso schrecklich aus, wie der aktualisierte Master und alle Anpassungen sind weg …

    Was habe ich denn da übersehen??

    Vielen Dank!!!

    Antworten
    • Hallo Bernd,
      inwiefern sieht das neue Sydney Theme schrecklich aus?
      Kannst du mir einen Screenshot per Mail schicken?

      Beste Grüße
      Patrick

      Antworten
  • Hallo Patrick,
    vielen Dank für die tolle Arbeit die du hier leistest! Deine Tutorials sind eine Klasse für sich! Bin noch mittendrin im Website bauen, aber es geht voran 🙂

    Ich hab da noch eine Frage:
    Wenn das Parent Theme nun ein Update erhalten hat, wird dann das Child auch davon betroffen, nur dass die individuellen Codes in footer.php usw. erhalten bleiben?
    Was muss ich nach einem Update des Themes beachten?`

    LG Klaus

    Antworten
    • Hi Klaus,

      beim Update bleiben die Änderungen, die du im Child Theme gemacht hast erhalten. Das ist ja der Sinn des Ganzen. 🙂

      So solltest du ohne Probleme Theme Updates durchführen können, ohne dass deine Änderungen verloren gehen.
      Generell würde ich dir aber immer empfehlen vor einem Update ein Backup deiner Seite zu machen.

      Beste Grüße
      Patrick

      Antworten
  • Hi Patrick,

    vielen Dank für dein Tutorial zum Erstellen der Website mit dem Theme Sydney. Nachdem ich schon viel gemacht habe, will ich heute das Sydney Theme einfügen. Bin deiner Anleitung gefolgt. Aber: footer.php und header.php einfügen geht nicht. Es ergibt sich unter dem Reiter Dateien leider nur eine leere Seite.

    Vielleicht kannst Du dazu was sagen?

    Beste Grüße Peter

    Antworten
    • Hallo Peter,

      schicke mir hierzu am besten eine Mail mit 1-2 Screenshots. Spontan kann ich hierzu leider nichts sagen.

      Beste Grüße
      Patrick

      Antworten
  • Hi Patrick, vielen Dank für deine Tutorials und viele nützliche Tips wie dieser.
    Ich habe noch die Frage: In Deinem „Website Tutorial“ fügst Du den Code aus dem Tutorial Ordner in Custom JavaScript ein. Kann man diesen Code auch in Child-Theme einfügen? Wenn ja, dann wie?
    Besten Dank im Voraus

    Schöne Grüße
    Andreas

    Antworten
    • Hallo Andreas,

      klar das ist möglich, aber nicht sonderlich anfängerfreundlich.

      Zuerst musst du einen Ordner in deinem Theme Ordner anlegen. Den nennst du „js“ oder ähnlich.
      Dann erstellst du deine Script Datei „dein-button.js“ in die du den Code einfügst.
      Anschließend gehst du in die Functions php und fügst das ein:

      add_action( ‚wp_enqueue_scripts‘, ‚add_my_script‘ );
      function add_my_script() {
      wp_enqueue_script(
      ‚dein-button‘,
      get_template_directory_uri() . ‚/js/dein-button.js‘,
      array(‚jquery‘)
      );
      }

      Gruß Patrick

      Antworten
  • Hallo Patrick, vorab vielen Dank für die tollen Anleitungen, alles passt und funktioniert super gut.
    Eine Frage habe ich: Werden Änderungen und Erweiterungen der Homepage am Parent Theme oder am Child Theme vorgenommen? Oder an beiden?
    Danke im voraus und : weiter so !

    Antworten
    • Hallo Roland,

      vielen Dank für deinen positiven Kommentar!
      Wenn du Code hinzufügen möchtest, fügst du diesen in das Child Theme ein.

      Beste Grüße
      Patrick

      Antworten
  • Ersteinmal herzlichen Dank für das super Tutorial!
    Ich habe erfolgreich ein Child Theme mit den Dateien header.php footer.php erstellt und aktiviert. Die Datei style.css kann ich auch editieren. Beim Speichern der beiden PHP-Dateien kommt jedoch die Meldung:
    „Kommunikation mit der Website, um auf fatale Fehler zu prüfen, nicht möglich, daher wurde die PHP-Änderung rückgängig gemacht. Du wirst deine veränderte PHP-Datei mit anderen Mitteln hochladen müssen, wie per SFTP.“
    Woran kann das liegen?

    Antworten
    • Hi, super freut mich, dass es gefällt!
      Hast du im Editor auf das „Child Theme“ gewechselt?

      Antworten
      • Ja. Ich habe festgestellt, dass es funktioniert, wenn das Child Theme nicht aktiv ist. Möglicherweise liegt das an der Entwicklungsumgebung MAMP (MacOS). Trotzdem danke!

        Antworten
  • Hallo Patrick,
    deine Erklärungen haben mir sehr gut gefallen und somit konnte ich meine Webseite schnell erstellen. Vielen Dank. Vorher habe ich sämtliche Videos angeschaut, die mir nicht weiter geholfen haben. Nur Du. Bitte mache weiter. Bin richtig happy über meine Seite.

    Antworten
  • Hey Patrick,
    echt super erklärt! So einen Beitrag hätte ich vor zwei Jahren echt gut gebrauchen können 🙂 Persönlich nehme ich das Plugin „Child Themify“ her und bin seither zufrieden damit.
    Aber ja, weiter so!
    LG

    Antworten
    • Hätte ich das nur gewusst, dann wäre dieser Artikel schon viel früher erschienen. 🙂

      Antworten

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Aktueller Top Deal!

10% Rabatt auf das Divi Theme von Elegant Themes!