Video-Tutorial: Ein WordPress Child-Theme erstellen

In dieser kleinen Video-Anleitung erkläre ich, wie du dir in nur ein paar Schritten ein eigenes WordPress Child-Theme erstellen kannst. Ein Child-Theme ist besonders praktisch, um individuelle Anpassungen an einem Theme sicher vorzunehmen. Denn in einem Child-Theme sind deine Anpassungen im Stylesheet und den Template-Dateien auch bei einem späteren Update des Parent-Themes gespeichert. Und damit du auch gleich mit der Erstellung deines eigenen Child-Themes loslegen kannst, habe ich im Anschluss zum Video noch ein Beispiel Child-Theme zum downloaden vorbereitet.


Beispiel Child-Theme Ordner downloaden

Als Grundlage für die Erstellung deines eigenen Child Themes, kannst du dir diesen Beispiel Child-Theme Ordner herunterladen.

CSS-Beschreibung in der style.css Datei des Child-Themes
/*   
Theme Name: DeinChildTheme
Description: Beschreibungstext...
Author: Dein Name
Author URI: http://www.deinedomain.de/
Template: parentthemeordner
Version: 1.0
Tags:
*/
Hilfreiche Artikel zum Weiterlesen

Hast du Fragen oder weitere Tipps zur Erstellung eines Child-Themes in WordPress? Über dein Feedback und deine Tipps freue ich mich sehr!

Ellen

Hi, ich bin Ellen - WordPress-Theme-Entwicklerin und Bloggerin bei Elmastudio. Ich liebe das Internet, Reisen, Vegan-Thaifood, Neuseeland und jede Menge Kaffee grünen Tee.

Kommentare (28) Schreibe einen Kommentar

  1. Hi Ellen,
    Infos sind super! Aber zwecksmäßiger Weise empfinde ich das Video als viel zu lang. Interessierte könnten sich beim Anschauen verlaufen. Klare Argumente für das Child-Theming und wertvolle “How-To’s” – mehr nicht. Maximal 5 Minuten reichen für dieses einfache Thema als Video-Anleitung völlig. Wissen komprimieren!

    Lieben Gruß, Jonathan

    Antworten

    • Hallo Jonathan,

      vielen Dank für dein Feedback zum Tutorial. Da das Tutorial ja vor allem als Einsteiger-Anleitung zum Thema “Child Themes” gedacht ist, finde ich es eigentlich recht sinnvoll nicht zu schnell die Fakten abzuarbeiten, sondern sich mit der Erklärung etwas Zeit zu lassen. So können sich die Zuhörer auch etwas länger den Code anschauen und diesen dann auch wirklich gut verstehen.

      An der Präsentation des Tutorials will ich aber auf alle Fälle noch arbeiten, so dass die Erklärungen noch etwas flüssiger kommen. Manchmal ist es gar nicht so einfach, die richtigen Worte zu finden, da man normalerweise ja eher schweigend vor sich hin arbeitet :-)

      Viele Grüße,
      Ellen

      Antworten

  2. Hallo, Ellen,
    vielen Dank fürs Erklären!
    Wie ist das eigentlich, wenn das parent-theme Unterordner hat, also nicht alle theme-Dateien auf einer Ebene liegen?
    Hast Du damit Erfahrung?

    Schöne Grüße von Kirsten

    Antworten

    • Hallo Kirsten,

      vielen Dank für deinen Kommentar. Es kommt immer ein wenig darauf an, um welche Art von Dateien es sich handelt. Aber wenn du die Theme-Dateien im Child Theme nutzen möchtest, würde ich die Struktur des Parent Themes auf jeden Fall beibehalten. Das ist dann bei einer späteren Bearbeitung auch übersichtlicher.

      Viele Grüße,
      Ellen

      Antworten

  3. Hallo, vielen Dank für das Tutorial. Ich habe im Moment keine Frage, hänge mich einfach hier rein, damit ich alle künftigen Posts erhalte, da ich mich nächstens an einem Child-Theme versuchen will. Liebe Grüsse, Dominik

    Antworten

  4. Danke für dieses schöne Tutorial. Ich möchte bald auch ein WordPress Blog erstellen und da werde ich dieses Video sicherlich gebrauchen können. Sehr schöne Arbeit!

    lG Saskia

    Antworten

  5. @Dominik, @Michel, @Saskia,

    vielen Dank für euer Feedback. Es freut mich, wenn euch das Video-Tutorial bei eurer Arbeit weiterhelfen kann :-)

    Viele Grüße,
    Ellen

    Antworten

  6. Ich habe aktuell bemerkt beim Bearbeiten eines Childthemes, dass man die Pfade in der CSS-Datei für Bilder auch anpassen muss. Jedenfalls kann man den Code der CSS-Datei nicht einfach kopieren, sondern man muss entweder den Bilderordner kopieren oder die relativen Pfade anpassen bzw. in absolute Pfade umwandeln. Und ich muss zugeben, dass ich nicht so schnell darauf gekommen bin …

    Antworten

  7. Mich würde intressieren mit welchem Programm du dieses Video erstellt hast.
    Mit einem WordPressblog ist sich sicherlich einiges mehr möglich als mit einem Posterousblog.
    schöne Grüße aus dem Emsland

    Antworten

  8. Trotz Anfangsschwierigkeiten hat das Anlegen und Bearbeiten des Child-Themes gut geklappt. Innerhalb von zwei Stunden hatte ich fast alle meine Vorstellungen umgesetzt. Ein Problem habe ich noch. Vielleicht kann ich es noch lösen.

    Auch das von Marc geschilderte Problem ist bei mir aufgetaucht. Da ich eine Bilddatei austauschen wollte habe ich den kompletten Bild-Ordner in den Child-Theme-Ordner kopiert und die Bilddatei ausgetauscht. Seite neu laden. Alle Symbole tauchten anschließend auf.

    Antworten

  9. Hi,
    ich super Video danke das hab ich gesucht.

    Hast du vielleicht noch einen Tipp, welche Themes sich besonders gut für ein Child Theme eignen? Im Prinzip bräuchte ich ein Basistheme, das schon einiges an Funktionen mitbringt – das man dann auch super personalisieren kann. Gibt es sowas? Hab Whiteboard gefunden aber sooo ganz zufrieden bin ich damit noch nicht. Danke :)
    Janina

    Antworten

  10. Pingback: TiBStudio mit Responsive Layout und einem neuen Design › TiBStudio

  11. Pingback: Neues Theme für den Blog | jm bloggt

  12. Pingback: Timms Blogwelten mit responsive Layout HTML5 und CSS3 › Timm's Blogwelten

  13. Pingback: Richtiges Theme für den Blog finden – Woche 8 des 13-Wochen-Projekts | Consulting Burkhardt Blog

  14. Super Anleitung und gleich ebenso kapiert – umgesetzt. Perfekt.

    Danke. Schöne Feiertag und ein guten Rutsch.

    Antworten

  15. eure themes und tutorials machen immer wieder spass.
    wollte gerade etwas am waipoua anpassen – child theme tutorial angeschaut – änderung durchgeführt – perfekt!
    vielen dank für deine/eure tolle arbeit!

    Antworten

  16. Tolle Anleitung, DANKE!!!

    würdest DU Child-Theme verwenden um im Header unterschiedliche Grafiken mit jeweils einem Hyperlink auf eine unterschiedliche Webpage verwenden?

    DANKE

    Antworten

  17. Liebe Ellen

    Ich liebe deine Tutorials, ich war ein absoluter Anfänger und nun hab ich das Gefühl ich wisse schon so einiges. Das Tempo ist übrigens perfekt :)

    Liebe Grüsse
    Sarah

    Antworten

  18. Pingback: Ich habe mir mein eigenes Wordpress-Theme gebastelt | Schafott

  19. Hi,
    deine Tuts sind wirklich klasse, ich mache mich seit langer Zeit mal wieder auf, um eine Seite für meine Schwester anzupassen und fange an. WP wieder zu lieben – auch dank deiner Tuts.
    Zu dem Child-Theme vielleicht noch eine kleine Anmerkung:
    Man sollte darauf achten, den Child-Ordner OHNE Leerzeichen zu benennen, sonst wird es im Frontend nicht wirklich gefunden, und das Template wird nicht dargestellt.
    Danke noch einmal
    Dagmar

    Antworten

  20. Danke Ellen. Ich habs mit deiner Anleitung hinbekommen. Aber wie ein paar meiner Vorschreiber schon sagten: TOO MUCH.

    Die Hälfte des Videos hätte es auch getan.

    Trotzdem Merci

    Gruß
    Rainer

    Antworten

  21. Moin Ellen,

    ich finde das Tuto sehr gelungen, viele Dank dafür.
    Eine Frage hätte ich noch an dich.

    Ich würde gerne in den Footer ein Bild mit dem entspechenden Link enbauen. Hättest du einen Tip für mich. Das Theme ist Yoko.

    Vielen Dank

    Kosta

    Antworten

  22. Hy Ellen,
    ich bin noch nicht sattelfest in WP und da kommt auch schon der erste ERROR daher.
    Hab ein ChildTheme (lt. deinem Video) auf den Server geladen u. wollte es aktivieren in WP. Bei Klick auf aktivieren kam folgende Meldung:
    Fatal error: Cannot redeclare my_javascripts() (previously declared in /home/.sites/60/site2973/web/wp-content/themes/finexchild/functions.php:11) in /home/.sites/60/site2973/web/wp-content/themes/finex/functions.php on line 25

    Jetzt kann ich mich nicht mehr einloggen. Hast du einen TIpp, wie ich das lösen kann???

    LG, Gitti

    Antworten

Hinterlasse eine Antwort

Pflichtfelder sind mit * markiert.