# WordPress-Child-Themes erstellen: Funktionsweise und Aufbau

[WordPress](https://www.ionos.at/digitalguide/hosting/cms/wordpress-das-bekannte-cms-unter-der-lupe/) entwickelte sich über die Jahre weg von einem einfachen Blogsystem zu einem **benutzerfreundlichen CMS** und ist mittlerweile aus dem World Wide Web nicht mehr wegzudenken. Dank dieser Beliebtheit haben sich viele WordPress-Profis darauf spezialisiert, [WordPress-Themes](https://www.ionos.at/digitalguide/hosting/blogs/wordpress-themes-die-besten-designs-fuer-ihre-website/) als Vorlage für Websites bereitzustellen. Diese bringen schon **so gut wie alle Funktionalitäten** mit sich und entsprechen jeweils auch optisch den ungefähren Vorstellungen von Seitenbetreibern. Doch eben nur ungefähr. Anpassungen am Code, um die Seite an das Corporate Design anzupassen, oder Änderungen am Aufbau müssen hier und da noch gemacht werden. Doch was ist mit den Änderungen, wenn das Theme geupdatet wird? Hier kommen WordPress-Child-Themes in Spiel.

## Was ist ein WordPress-Child-Theme?

Um zu vermeiden, dass ein Theme-Update eigene Änderungen überschreibt, lohnt es sich, ein WordPress-Child-Theme zu erstellen. Ein WordPress-Child-Theme ist, wie der Name verrät, **das „Kind“ eines übergeordneten (Parent-)Themes**. Es ist mit dem Parent-Theme so verknüpft, dass es dessen Aussehen und Funktionen erbt. Führen Sie individuelle Anpassungen im WordPress-Child-Theme durch, **überschreiben diese automatisch die Anweisungen** des Parent-Themes. Änderungen wirken sich somit nicht auf das übergeordnete Theme aus. Steht ein Update des Parent-Themes an, bleiben die Änderungen des WordPress-Child-Themes bestehen.

Tipp Während Sie größere Anpassungen oder Updates durchführen, können Fehlermeldungen auf der Website entstehen. Um Nutzer nicht zu irritieren, sollten Sie den [WordPress-Wartungsmodus](https://www.ionos.at/digitalguide/hosting/cms/wordpress-wartungsmodus/) aktivieren.

## Woraus besteht ein WordPress-Child-Theme?

Ein WordPress-Child-Theme kann unterschiedliche Bestandteile haben. Ausschlaggebend sind die Änderungen, die Sie durchführen, und in welchen Dateien diese stattfinden. Jedoch gibt es gewisse Dateien, die Sie für jedes WordPress-Child-Theme erstellen müssen, **damit es reibungslos funktioniert**:

- [CSS Style Sheet](https://www.ionos.at/digitalguide/websites/webdesign/css-lernen-leicht-gemacht/)-Datei *style.css*
- *function.php*
- *screenshot.png* (optional)

Doch wieso benötigt ein WordPress-Child-Theme diese drei Dateien?

## WordPress-Child-Themes: Funktionsweise

Wie bereits erwähnt funktioniert ein WordPress-Child-Theme erst, wenn es die oben genannten Dateien enthält. Die Dateien haben folgende Funktionen:

- ***style.css*** enthält alle CSS-Regeln und Deklarationen, die das Aussehen des Themes steuern. Wichtig ist vor allem der Header-Bereich. Hier teilt die CSS-Datei WordPress mit, dass es sich um ein **untergeordnetes Theme mit einem bestimmten Parent-Theme** handelt, und liefert weitere grundlegende Informationen.
- ***function.php*** bestimmt die Reihenfolge, in der die Style Sheets des Parent und WordPress-Child-Themes laden. Damit die Änderungen des Child-Themes die Anweisungen des Parent-Themes überschreiben, muss der Browser das Style Sheet des WordPress-Child-Themes **nach dem Style Sheet des Parent-Themes laden**.
- ***screenshot.png*** ist optional, empfiehlt sich aber, um im WordPress-Backend das **WordPress-Child-Theme direkt zu erkennen**. WordPress zeigt *screenshot.png*-Dateien automatisch im Theme-Menü bei der entsprechenden Vorlage an.

Hinweis Wenn Sie nur kleinere Änderungen an dem Theme vornehmen, bieten sich auch einfachere Lösungen wie das [Simple Custom CSS Plugin](https://de.wordpress.org/plugins/simple-custom-css/ "WordPress Simple Custom CSS Plugin") oder der seit der WordPress-Version 4.7 integrierte Customizer an.

## Vor- und Nachteile des WordPress-Child-Themes

Grundlegend bringt ein WordPress-Child-Theme viele Vorteile mit sich. Doch es gibt auch einige Nachteile, weshalb Sie bei nur kleinen CSS-Änderungen überlegen sollten, ob es sich lohnt, extra ein Theme zu erstellen:

<table>
  <thead>
    <tr>
      <th>Vorteile</th>
      <th>Nachteile</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Änderungen werden beim Update des Parent-Themes nicht überschrieben.</td>
      <td>Das Update der ursprünglichen Vorlage schließt nur Sicherheitslücken in Template-Dateien, die im Parent-Theme-Ordner liegen. Bei den Template-Dateien im WordPress-Child-Themes-Ordner bleiben diese Lücken bestehen.</td>
    </tr>
    <tr>
      <td>Ein WordPress-Child-Theme bietet mehr Freiheiten gegenüber den Möglichkeiten im WordPress-Backend. Beispielsweise lassen sich Aufbau und Struktur der Website anpassen oder das Theme um bestimmte Funktionen erweitern.</td>
      <td>Eventuell entstehen Performance-Einbußen, da der Browser zwei Style Sheets lädt.</td>
    </tr>
    <tr>
      <td>Umfangreiche CSS-Anpassungen bleiben gegenüber dem Customizer von WordPress in der style.css übersichtlich.</td>
      <td></td>
    </tr>
    <tr>
      <td>WordPress-Child-Themes sind ideal für Anfänger, die WordPress besser kennenlernen möchten. Schleicht sich ein Fehler ein, können sie jederzeit auf das Parent-Theme zurückgreifen.</td>
      <td></td>
    </tr>
    <tr>
      <td>Die Entwicklungszeit der Website kann mit WordPress-Child-Themes beschleunigt werden.</td>
      <td></td>
    </tr>
  </tbody>
</table>

## WordPress-Child-Themes erstellen: Anleitung zum Selberbauen

Nachdem wir die Funktionen erklärt haben, schauen wir uns jetzt an, wie Sie ein funktionsfähiges WordPress-Child-Theme erstellen.

### Schritt 1: WordPress-Child-Themes-Ordner anlegen

Über einen [FTP-Client](https://www.ionos.at/digitalguide/hosting/hosting-technik/ftp-programme/ "FTP-Programme") (z. B. [FileZilla](https://filezilla-project.org/ "FileZilla FTP-Client")) verbinden Sie sich mit Ihrem Server und navigieren innerhalb der WordPress-Installation zu folgendem Ordner:

```none
ihr-pfad-zur-wordpress-installation/wp-content/themes/
```

Dort legen Sie einen Ordner für das WordPress-Child-Theme an. Am besten verwenden Sie als Namen die Bezeichnung des Parent-Themes mit „-child“ am Ende.

### Schritt 2: Style Sheet für das WordPress-Child-Theme erstellen

Legen Sie eine *style.css*-Datei an und fügen Sie folgende Informationen im Header-Bereich mit einem Texteditor ein:

```none
/*
 Theme Name:   [Name des Parent-Themes] Child
 Theme URI:    [http://example.de/parent-theme/]
 Description:  [Name des Parent-Themes] Child Theme
 Author:       [Ihr Name]
 Author URI:   [Die URL Ihrer Website]
 Template:     [Ordnername des Parent-Themes] 
 Version:      1.0.0
Text Domain:   [Name des Parent-Themes] -child
*/
```

Die Platzhalter in eckigen Klammern ersetzen Sie durch Ihre Angaben. Sie müssen nicht alle Punkte integrieren; lediglich diese zwei Informationen sind Voraussetzung, damit das WordPress-Child-Themes funktioniert:

- **Theme Name**: Jedes Theme braucht einen Namen, so auch das WordPress-Child-Theme. Dieser Name sollte **einzigartig** sein und nicht von einem anderen Theme innerhalb Ihrer WordPress-Installation verwendet werden.
- **Template**: Durch diese Information weiß WordPress, dass es sich um ein WordPress-Child-Theme des angegebenen Parent-Themes handelt.

Ist die Datei fertig, laden Sie sie über den FTP-Client in den Ordner des WordPress-Child-Themes.

### Schritt 3: Style Sheet in der function.php richtig laden

Im besten Fall wird im Parent-Theme bereits die Anweisung gegeben, das Style Sheet des WordPress-Child-Themes zu laden. Doch nicht alle Design-Vorlagen tun dies. Deshalb ist es wichtig, sich anzuschauen, was das Parent-Theme macht. Eine der drei folgenden Szenarien trifft dabei zu:

1. Das Parent-Theme lädt bereits beide Style Sheets. In dem Fall **muss das WordPress-Child-Theme nichts mehr machen**.
2. Lädt das Parent-Theme sein eigenes Style Sheet per *get\_template\_directory()* oder *get\_template\_directory\_uri()*, muss das WordPress-Child-Theme **nur das eigene Style Sheet** mit der entsprechenden Bezeichnung des Style Sheets des Parent-Themes als Parameter in der *function.php* laden.
3. Lädt das Parent Theme sein eigenes Style Sheet per *get\_stylesheet\_directory()* oder *get\_stylsheet\_directory\_uri()*, muss das WordPress-Child-Theme **beide Style Sheets** in der *function.php* laden. Achten Sie darauf, die Bezeichnung des Style Sheet des Parent-Themes eins zu eins zu übernehmen.

Tritt der zweite Fall ein, sieht die *function.php* so aus:

```none
<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
    wp_enqueue_style( 'child-style', get_stylesheet_uri(),
        array( 'Name des Parent-Theme Style Sheets'), 
        wp_get_theme()->get('Version') // Funktioniert nur, wenn der Punkt Version auch im Header-Bereich des Style Sheets angegeben ist 
    );
}
?>
```

Soll das WordPress-Child-Theme beide Style Sheets über die *function.php* laden, sieht der Code wie folgt aus:

```none
<?php
function child_theme_styles() {
wp_enqueue_style( 'Name des Parent-Theme Style Sheets', get_template_directory_uri() . '/style.css'); 
wp_enqueue_style( 'child-theme-css', get_stylesheet_directory_uri() .'/style.css' , array('Handle Name des Parent-Theme Style Sheets'));
}
add_action( 'wp_enqueue_scripts', 'child_theme_styles' );
?>
```

Die *function.php* legen Sie zu der *style.css*-Datei in den WordPress-Child-Themes-Ordner.

Hinweis Optional können Sie noch eine Bilddatei mit dem Dateinamen *screenshot.png* im WordPress-Child-Themes-Ordner ablegen. WordPress zeigt dieses Bild im Backend beim Theme an, damit sie die Vorlage besser zuordnen können.

### Schritt 4: WordPress-Child-Theme aktivieren

Nachdem das WordPress-Child-Theme erstellt ist, aktiveren Sie es wie jedes andere Theme im WordPress-Backend. Dazu einfach im Backend einloggen und unter **„Design“ &gt; „Themes“** das Child-Theme auswählen.

Hinweis Haben Sie bereits Anpassungen am Parent-Theme über den WordPress-Customizer durchgeführt, gehen diese Änderungen bei der Aktivierung des WordPress-Child-Themes verloren. Mit dem [Plugin Customizer Export/Import](https://de.wordpress.org/plugins/customizer-export-import/ "Customizer Export/Import Plugin") können Sie die Customizer-Einstellungen exportieren und anschließend wieder importieren.

Damit ist das WordPress-Child-Theme vollständig einsatzbereit. Wenn Sie Änderungen an anderen Template-Dateien durchführen möchten, kopieren Sie die Datei aus dem Parent-Theme und legen Sie sie in den Child-Theme-Ordner ab. Der Pfad muss dabei genau dem Pfad im Parent-Theme entsprechen. Die Datei des Parent-Themes wird automatisch durch die Datei im WordPress-Child-Themes-Ordner überschrieben.

Tipp Mit dem [Hosting für WordPress von IONOS](https://www.ionos.at/hosting/wordpress-hosting "Hosting für WordPress von IONOS") erhalten Sie eine speziell für WordPress optimierte Hosting-Plattform, die Ihnen den Weg zur eigenen WordPress-Website vereinfacht.


This is a markdown version of: [https://www.ionos.at/digitalguide/hosting/blogs/wordpress-child-theme-erstellen/](https://www.ionos.at/digitalguide/hosting/blogs/wordpress-child-theme-erstellen/) for AI/LLM consumption.