Erste Schritte¶

Vom fertigen Paket zur einsatzbereiten Seite in fünf Schritten.

Voraussetzungen¶

Getestet ist TWtheme bis WordPress 7.0. Ein Block-Theme setzt einen aktuellen Site-Editor voraus — auf älteren Installationen fehlen Funktionen, die die Templates verwenden.

1. Theme installieren¶

Die Auslieferung besteht aus mehreren ZIP-Dateien:

Installiert wird unter Design → Themes → Theme hinzufügen → Theme hochladen. Das Kernpaket zuerst.

Die Icons sind absichtlich getrennt, und zwar je Bibliothek einzeln: Alle zusammen machen 16 der 19 MB aus. Ein Projekt, das nur solid und brands braucht, überträgt rund 2,3 MB statt 16 und hat keine ungenutzten SVGs auf dem Server. Braucht ein Projekt keine Icons, lässt man diese Pakete ganz weg.

2. Child-Theme anlegen¶

Aktiviert wird nie der Parent, sondern immer ein Child-Theme. Selbst wenn ein Projekt zunächst nichts anpasst — sobald die erste Anpassung kommt, ist das Child schon da und nichts muss umgezogen werden.

Ein Child braucht zwei Dateien. Zuerst style.css mit dem Kopf, der den Parent benennt:

/**
 *  Theme Name:        Projektname
 *  Template:          twtheme
 *  Version:           1.0.0
 *  Requires at least: 6.7
 *  Requires PHP:      8.2
 *  Text Domain:       projektname
 */

Entscheidend ist Template: twtheme — daran erkennt WordPress den Parent.

Dann functions.php, um das Stylesheet zu laden:

<?php
defined('ABSPATH') || exit();

add_action('wp_enqueue_scripts', 'projektname_enqueue_assets', 30);
function projektname_enqueue_assets(): void
{
    $path = get_stylesheet_directory() . '/style.css';

    if (! is_readable($path)) {
        return;
    }

    wp_enqueue_style(
        'projektname',
        get_stylesheet_directory_uri() . '/style.css',
        function_exists('twtheme_main_style_deps') ? twtheme_main_style_deps() : [],
        (string) filemtime($path)
    );
}

twtheme_main_style_deps() sorgt dafür, dass das Parent-Bundle zuerst geladen wird und die Regeln des Childs gewinnen.

Als vollständige Vorlage dient das Theme TWtheme Demo. Dort ist jeder der vorgesehenen Erweiterungswege einmal ausgeschrieben.

Mehr dazu unter Child-Theme.

3. Module wählen¶

Nach der Aktivierung sind die meisten Module an. Unter Theme → Module schaltet man ab, was das Projekt nicht braucht.

Der Reihe nach durchgehen lohnt sich einmal am Anfang: Jedes aktive Modul lädt PHP, registriert womöglich Blöcke und zeigt Optionsfelder. Was aus bleibt, kostet nichts.

Zwei Entscheidungen sind dabei wichtig, weil sich die Optionen gegenseitig ausschließen:

Ausführlich unter Module schalten.

4. Grunddaten setzen¶

Unter Theme → Einstellungen kommen die Daten hinein, die überall auf der Seite gebraucht werden.

Im Reiter mit dem Namen der Website:

• Logos — Hauptlogo, Footer-Logo, Logo für das mobile Menü
• Contact Information — Telefon, E-Mail, Öffnungszeiten
• Channels — die Social-Media-Kanäle

Im Reiter Allgemein:

• Favicons — bleiben die Felder leer, greifen die Standarddateien des Themes

Die Kontaktdaten sind danach als Shortcode überall verfügbar: [tw-logo], [tw-phone], [tw-email], [tw-opening-hours]. Sie stehen also genau einmal in der Datenbank, auch wenn die Telefonnummer auf zehn Seiten erscheint.

Ausführlich unter Theme-Optionen.

5. Kopf- und Fußbereich bauen¶

Kopf- und Fußbereich sind Template-Parts und werden unter Design → Editor bearbeitet. Der Parent liefert eine schlichte Hülle, die ein Projekt ersetzt.

Für die Hauptnavigation gibt es zwei Wege:

Wenn etwas fehlt¶

Zeigt ein Block sich nicht im Editor oder wirkt eine Einstellung nicht, ist fast immer das zugehörige Modul aus. Die Seite Theme → Info listet auf, welche Module laufen, dazu die Versionen von Theme, WordPress, PHP und allen Plugins — mit einem kopierfertigen Bericht für Supportanfragen.

Wie es weitergeht¶