Die Architektur sowie die Kerndateien von WordPress-Themen

3-Minuten-Lesung
2026-03-13
2026-06-04
2,421
Ich bekomme eine Provision, wenn du über die untenstehenden Links einkaufst – ohne zusätzliche Kosten für dich.

Die Architektur sowie die Kerndateien von WordPress-Themen

Ein standardisiertes WordPress-Theme ist nicht nur eine Sammlung von CSS-Stylesheets, sondern ein organisches Ganzes, das aus einer Reihe von PHP-Template-Dateien sowie weiteren Ressourcen besteht, die bestimmten Vorgaben folgen. Diese Dateien arbeiten zusammen, um den Inhalt aus der Datenbank mit dem Design zu verbinden und die Webseiten zu erstellen, die die Benutzer letztendlich sehen.

Jedes Thema befindet sich im Installationsverzeichnis von WordPress.wp-content/themesDie Dateien befinden sich innerhalb einer Ordnerstruktur und existieren als separate Unterverzeichnisse. Der Kern dieser Struktur ist das Template-Hierarchiesystem: WordPress wählt automatisch das am besten passende Template aus, abhängig vom Typ der angeforderten Seite (z. B. Startseite, Artikelseite, Einzelseite, Kategorienseite usw.), um die Inhalte darzustellen.

Die beiden grundlegendsten und unverzichtbaren Dateien sind…style.cssundindex.phpstyle.cssNicht nur werden die Styles des Themes definiert, sondern auch der Kommentarblock am Anfang der Datei enthält Metadaten des Themes – wie den Namen des Themes, den Autor, eine Beschreibung sowie die Version. Dies sind die einzigen Identifikationsmerkmale, die WordPress benötigt, um ein Theme zu erkennen.index.phpEs dient als letzter, alternativer Template-Standard: Falls keine anderen, spezifischeren Template-Dateien vorhanden sind, verwendet WordPress standardmäßig dieses Template.

Empfohlene Lektüre Eine vollständige Anleitung zur Entwicklung von WordPress-Themen: Ein praktischer Leitfaden von der ersten Idee bis zur Live-Veröffentlichung.

Themeninformationen-Definition-Datei

„Themenbezogen“style.cssDer Dateianfang muss einen standardisierten Kommentar enthalten, der dazu dient, das Theme bei WordPress zu registrieren. Hier ist ein Beispiel:

UltaHost – WordPress-Hosting-Anbieter
30-tägige Geld-zurück-Garantie, unbegrenztes Bandbreiten- und Datenbankvolumen, kostenlose DDoS-Schutzmaßnahmen sowie ein Rabatt von 501 auf 4 Terabyte bei einer Kaufdauer von 3 Jahren.
/*
Theme Name: My Awesome Theme
Theme URI: https://example.com/my-awesome-theme/
Author: Your Name
Author URI: https://example.com/
Description: 这是一个简洁、响应式的现代化WordPress主题。
Version: 1.0.0
License: GPL v2 or later
Text Domain: my-awesome-theme
*/

Unter diesen Elementen dient “Text Domain” der Internationalisierung und wird später für die Verwendung von Übersetzungsfunktionen genutzt.__()oder_e()Identifikatoren, die bei der Verarbeitung von Zeitdaten unbedingt verwendet werden müssen.

Core template files and their hierarchy

Die Template-Hierarchie von WordPress bestimmt die Rendering-Logik der verschiedenen Seiten. Wenn beispielsweise eine einzelne Artikelseite aufgerufen wird, sucht WordPress nach den passenden Templates in der folgenden Reihenfolge:single-{post-type}-{slug}.php > single-{post-type}.php > single.php > singular.php > index.php

Zu den häufig verwendeten Kernvorlagendateien gehören:
* header.phpVerantwortlich für die Erstellung des Dokumentenheaders, der in der Regel folgende Elemente enthält:<!DOCTYPE html>Erklärung,<head>Regionale Strukturen sowie die Oberseite der Seiten.
* footer.phpVerantwortlich für die Ausgabe der Informationen am unteren Rand der Seite, einschließlich Urheberrechtsangaben und Skripten.
* sidebar.phpDefiniert den Bereich für die Seitenleiste.
* functions.phpDatei zur Funktionalitätserweiterung des Themas, zur Hinzufügung neuer Funktionen, Registrierung von Menüs, Widgets usw.
* page.php: Zur Rendering von statischen Seiten.
* single.php:Dient zur Darstellung eines einzelnen Artikels.
* archive.php:Dient auf Seiten mit Artikellisten – beispielsweise in Kategorien, mit Tags oder in Listen von Artikeln von Autoren.
* front-page.phpWenn dieser Template als statische Startseite eingestellt wird, hat er eine höhere Priorität als andere Templates.home.php
* home.phpStartseite der Blogartikelliste.

Unterthema: Best Practices für die Sicherheitsanpassung von Themes

Das Direkte Ändern von Dateien von Drittanbieter-Themen ist ein risikoreiches Verhalten, da Updates des Themes alle eigenen Anpassungen überschreiben. Zu diesem Zweck bietet WordPress das Subtheme-System an. Subthemes erben alle Funktionen und Styles des übergeordneten Themes und ermöglichen es Ihnen gleichzeitig, sicher bestimmte Dateien des übergeordneten Themes zu überschreiben oder neue Funktionen hinzuzufügen.

Empfohlene Lektüre Pflichtlektüre für Programmierer: Wie Sie das für Sie am besten geeignete WordPress-Theme auswählen und anpassen können

Das Erstellen eines Unterthemas ist sehr einfach – man muss lediglich…themesErstellen Sie unter dem Verzeichnis ein neues Verzeichnis und erstellen Sie darin eine Datei, die die erforderlichen Kopfinformationen enthält.style.cssDatei, die auf jeden Fall überprüft werden muss.TemplateErkläre das übergeordnete Thema.

Erstellen Sie ein grundlegendes Untertema.

Ein sehr einfaches Untertema enthält lediglich zwei Dateien:style.cssundfunctions.phpDie Unterthemen vonstyle.cssDie Kopf-Anmerkungen müssen den übergeordneten Thema eindeutig angeben.

/*
Theme Name: My Awesome Child Theme
Template: twentytwentyfour // 此行必须,且必须与父主题文件夹名称完全一致
Description: 这是 Twenty Twenty-Four 主题的子主题,用于自定义。
Version: 1.0
*/

Als Nächstes ist es notwendig, in den Untertiteln…functions.phpIn der Datei werden die Stylesheets der übergeordneten Themen in der Reihenfolge geladen. Dies ist die Standardvorgehensweise:

hosting.com Shared Hosting
Hohe Leistung mit AMD EPYC-CPUs, NVMe-SSD-Speicher und LiteSpeed, fachkundiger Inhouse-Support rund um die Uhr, erweiterte Sicherheitsmaßnahmen einschließlich SSL, Brute-Force-, Malware- und DDoS-Schutz, Einsparungen von bis zu 73%
<?php
add_action( 'wp_enqueue_scripts', 'my_child_theme_enqueue_styles' );
function my_child_theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style',
        get_template_directory_uri() . '/style.css' // 加载父主题样式
    );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css', // 加载子主题样式
        array('parent-style'), // 声明依赖父样式
        wp_get_theme()->get('Version')
    );
}

Auf diese Weise wird das Design des Untertemas nach dem Design des Überthemas geladen, wodurch sichergestellt wird, dass Ihre eigenen CSS-Änderungen die Einstellungen des Überthemas korrekt überschreiben.

Die Elvertemplattdatei überschreiben

Falls Sie die Struktur einer Seite ändern müssen, genügt es, die entsprechende Template-Datei aus dem übergeordneten Thema in das Verzeichnis des untergeordneten Themas zu kopieren und anschließend die Änderungen vorzunehmen. Zum Beispiel, um die Seite für einzelne Artikel zu bearbeiten, kopieren Sie die entsprechende Datei aus dem übergeordneten Thema in das Verzeichnis des untergeordneten Themas.single.phpKopieren Sie die Dateien in den Root-Verzeichnis des Sub-Themes und bearbeiten Sie sie dort. WordPress verwendet in der Regel die Versionen der Dateien, die sich im Sub-Theme befinden.

Core of Theme Development: Function Files and Template Tags

functions.phpEs handelt sich um das “Gehirn” des Themes – eine Komponente, die es Entwicklern ermöglicht, verschiedene Funktionen für WordPress hinzuzufügen, ohne die Kerndateien des Themes anzupassen. Diese Datei wird automatisch beim Initialisieren des Themes geladen. Die Template-Tags hingegen werden in den Template-Dateien verwendet und sind PHP-Funktionen, die dazu dienen, Inhalte dynamisch auszugeben.

Empfohlene Lektüre Ausgewählte hochwertige WordPress-Themen für 2026: Leitfaden für kostenlose und kostenpflichtige Entwicklung

Anwendung von Funktionen und Funktionsspezifikationsdateien

„In“functions.phpIn diesem Kontext können Sie Funktionen mithilfe von Aktionshaken (Action Hooks) und Filtern erweitern. Zum Beispiel können Sie eine Haupt-Navigationsmenü-Region registrieren:

<?php
add_action( 'after_setup_theme', 'mytheme_setup' );
function mytheme_setup() {
    // 注册导航菜单
    register_nav_menus( array(
        'primary' => __( '主导航菜单', 'mytheme-textdomain' ),
        'footer'  => __( '页脚菜单', 'mytheme-textdomain' ),
    ) );
    // 添加主题对文章特色图像的支持
    add_theme_support( 'post-thumbnails' );
}

Eine weitere häufige Aktion ist das Registrieren eines kleinen Tools für die Seitenleiste:

InterServer Shared Hosting
Shared Hosting $2.50 USD pro Monat, erster Monat $0.1 USD Promo-Code tryinterserver, 461 Cloud-Apps Skripte, ein Klick installieren.
add_action( 'widgets_init', 'mytheme_widgets_init' );
function mytheme_widgets_init() {
    register_sidebar( array(
        'name'          =&gt; __( '文章侧边栏', 'mytheme-textdomain' ),
        'id'            =&gt; 'sidebar-1',
        'description'   =&gt; __( '在此添加文章页的小工具。', 'mytheme-textdomain' ),
        'before_widget' =&gt; '<section id="%1$s" class="widget %2$s">',
        'after_widget'  =&gt; '</section>',
        'before_title'  =&gt; '<h2 class="widget-title">',
        'after_title'   =&gt; '</h2>',
    ) );
}

Analyse der gängigsten Template-Tag-Elemente

Template Tags werden in Template-Dateien (z. B.) verwendet, um…header.php, single.phpDynamische Daten werden in den Text eingefügt. Zum Beispiel:
* wp_head() und wp_footer()Sie müssen jeweils separat im Thema platziert werden.header.phpDas ist eine gute Frage.<head>„Bevor es endet…“footer.phpDas ist eine gute Frage.</body>Vor den Tags wird Code eingefügt, der zur Einbettung von Plugins sowie zur Ausführung von Kernfunktionen dient.
* bloginfo(‘name’): Ausgabe des Website-Titels.
* the_title()Ausgabe des Titels des aktuellen Artikels oder der aktuellen Seite in einer Schleife.
* the_content(): Zeigt den Hauptinhalt des Artikels/der Seite an.
* the_permalink()Erhalten Sie den festen Link zum aktuellen Artikel.
* the_post_thumbnail(): Zeigt die charakteristischen Bilder des Artikels an.
* dynamic_sidebar(‘sidebar-1’)In der Vorlage wird ein Widget-Bereich mit der angegebenen ID angezeigt.

Ein einfaches Beispiel für eine Artikelzirkulation, das häufig vorkommt…index.phpoderarchive.phpMittel:

<article>
        <h2><a href="/de/</?php the_permalink(); ?>"></a></h2>
        
    </article>

Reaktives Design und Optimierung der Leistung von Themes

Moderne WordPress-Themen müssen responsiv sein und auf verschiedenen Geräten ein gutes Benutzererlebnis bieten. Zudem ist die Leistungsoptimierung direkt mit dem Benutzererlebnis sowie den SEO-Ranglisten verbunden.

Die Implementierung eines responsiven Layouts

Reaktives Design wird in der Regel mithilfe von CSS-Mediaqueries umgesetzt.style.cssDie Stylesheets sollten Regelungen enthalten, die sich an verschiedene Bildschirmgrößen anpassen. Gleichzeitig muss sichergestellt werden, dass die Darstellung auf allen Geräten einheitlich und korrekt ist.header.phpDas ist eine gute Frage.<head>Regionen werden mit den viewport-Metatags hinzugefügt:

<meta name="viewport" content="width=device-width, initial-scale=1">

Für Bilder kann man folgende Methoden verwenden:srcsetMit diesen Eigenschaften kann der Browser je nach Bildschirmauflösung das passende Bildformat auswählen. Dies funktioniert in WordPress ebenfalls.the_post_thumbnail()Die Funktion unterstützt diese Eigenschaft automatisch, wenn die entsprechenden Parameter übergeben werden.

Themenbasierte Strategien zur Leistungsverbesserung

Die Leistungsoptimierung umfasst mehrere Aspekte. Zunächst muss sichergestellt werden, dass die Themen die Skripte und Stylesheets in der richtigen Reihenfolge laden und die richtigen Abhängigkeiten angegeben werden, um das Rendering nicht zu blockieren.wp_enqueue_script()Der letzte Parameter einer Funktion kann so festgelegt werden, dass…truePlatzieren Sie das Skript zum Laden am Ende der Seite.

Zweitens: Nutzen Sie die Caching-Möglichkeiten sowie die „Transient APIs“ von WordPress sinnvoll. Für Datenbankergebnisse, die sich nicht häufig ändern, aber eine aufwendige Abfrage erfordern, können diese Strategien eingesetzt werden.set_transient()undget_transient()Die Daten werden gespeichert, um doppelte Abfragen zu vermeiden.

Darüber hinaus sind die Optimierung von Bildern, das „Lazy Loading“ (d. h. das verzögerte Laden von Inhalten), die Reduzierung von HTTP-Anfragen (z. B. durch das Zusammenführen von CSS- und JS-Dateien) sowie die Verwendung moderner Bildformate wie WebP von entscheidender Bedeutung für die Leistung eines Webseitenprojekts. Viele dieser Funktionen können mithilfe von Leistungsoptimierungs-Plugins (wie WP Rocket) oder unabhängigen Script-Bibliotheken implementiert werden; das verwendete Theme sollte jedoch eine gute Basis für die Kompatibilität dieser Optimierungen bieten.

Schließlich sollten Sie sicherstellen, dass der Themencode einfach und effizient ist und unnötige Datenbankabfragen vermieden werden. Während der Entwicklung können Sie Plugins wie Query Monitor verwenden, um die Anzahl der Abfragen beim Laden der Seiten sowie Leistungsschwachstellen zu überwachen.

Zusammenfassungen

Das Verständnis und Beherrschen der Entwicklung von WordPress-Themen ist ein entscheidender Schritt, um von einem gewöhnlichen Benutzer zu einem Website-Bauer aufzusteigen. Es beginnt mit der Grundarchitektur der Themen und den Strukturen der Templates, geht über die Nutzung von Sub-Themen für sichere Anpassungen bis hin zu weiteren Möglichkeiten zur Individualisierung der Website-Optik und Funktionalitäten.functions.phpThemen verfügen über mächtige dynamische Funktionen dank der verwendeten Vorlagen- und Tags. Jeder Schritt bei der Entwicklung basiert auf dem leistungsstarken und flexiblen WordPress-System. Ein erfolgreiches Thema sollte außerdem auf ein responsives Design sowie auf Optimierungen der Leistung achten – dies beeinflusst direkt die Benutzerfreundlichkeit auf verschiedenen Geräten, das Erlebnis der Nutzer sowie die Platzierung im Suchmaschinenrankings. Nur durch die Einhaltung von Best Practices und Standards kann ein hochwertiges WordPress-Theme erstellt werden, das sowohl ästhetisch ansprechend als auch effizient und leicht zu warten ist.

FAQ Häufig gestellte Fragen

Wie kann ich die Layout-Struktur einer bestimmten Seite eines Themes ändern?

Zunächst müssen Sie über die Template-Hierarchie von WordPress herausfinden, welches Template-File für die Seite verwendet wird, die Sie bearbeiten möchten (beispielsweise könnte eine Seite für eine bestimmte Kategorie ein bestimmtes Template verwenden).category-{slug}.phpAnschließend erstellen Sie in dem Verzeichnis Ihrer Untertema ein Datei mit dem gleichen Namen wie das entsprechende Datei im Hauptthema, kopieren Sie den Inhalt dieser Datei in die neue Datei und fügen Sie dort Änderungen hinzu. Dadurch wird WordPress bevorzugt die Vorlage-Datei aus Ihrer Untertema verwenden.

Warum wirken meine eigenen CSS-Styles nicht?

Das liegt in der Regel daran, dass die Spezifität der CSS-Selektoren nicht ausreicht oder die Lade-Reihenfolge der CSS-Dateien falsch ist. Zuerst solltest du die Entwicklerwerkzeuge deines Browsers überprüfen, um sicherzustellen, dass deine CSS-Regeln tatsächlich angewendet werden – oder ob sie von anderen, spezifischeren Regeln überschrieben werden. Außerdem musst du sicherstellen, dass du die entsprechenden Änderungen an der richtigen Untertema-Datei vornimmst.style.cssDie Datei wurde erfolgreich erstellt, und sie hat die erforderlichen Prüfungen bestanden.wp_enqueue_style()Die Dateien werden in der richtigen Reihenfolge geladen und befinden sich nach der Stylesheet des übergeordneten Themas. Fügen Sie sie nach den benutzerdefinierten Stylesheet-Regeln hinzu.!importantEs handelt sich um eine temporäre Lösung, aber es sollte vorrangig versucht werden, das Problem durch eine höhere Spezifität der Selektoren zu beheben.

Wie fügt man bei der Entwicklung von Themes PHP-Fehler hinzu?

Es wird empfohlen, den Debugging-Modus von WordPress in der Entwicklungsumgebung einzuschalten. Öffnen Sie dazu die Website…wp-config.phpDateien: Finden Sie die entsprechenden Dateien und ändern Sie die darin enthaltenen Definitionen wie folgt:

define( 'WP_DEBUG', true );
define( 'WP_DEBUG_LOG', true ); // 将错误记录到 /wp-content/debug.log
define( 'WP_DEBUG_DISPLAY', false ); // 不要在页面上显示错误

So werden PHP-Fehler und Warnungen in die Protokolldateien aufgezeichnet und nicht direkt den Besuchern angezeigt, was es Ihnen erleichtert, die Ursache des Problems zu finden.

Mein Thema muss mehrsprachig unterstützt werden – wie kann ich das umsetzen?

WordPress nutzt das gettext-Framework für die Internationalisierung. Es gibt zwei wichtige Dinge, die Sie beachten müssen: Erstens müssen Sie an allen Stellen im Code, an denen Texte übersetzt werden sollen, die entsprechenden Übersetzungsfunktionen verwenden.__(‘文本’, ‘text-domain’)oder_e(‘文本’, ‘text-domain’)Verpacken Sie die Sendung und stellen Sie sicher, dass alles ordnungsgemäß erfolgt.text-domainErstens muss der Textbereich des Themes mit dem Thema übereinstimmen. Zweitens kann man Tools wie Poedit verwenden, um den Code des Themes zu scannen und entsprechende Inhalte zu generieren..potDie Vorlage-Datei dient als Grundlage, um die entsprechenden Sprachversionen zu erstellen (z. B. …).zh_CN.poDie Übersetzungsdatei für „)“ sollte schließlich kompiliert werden..moDatei, in das Thema einfügen.languagesEinfach eine Ordnerstruktur genügt.