WordPress-Plugin refactoren: Trennung von Frontend, Backend und Logik

Im letzten Beitrag habe ich auf die Schnelle ein Mini-Plugin als eine einzige PHP-Datei erstellt, die sowohl Logik, HTML und Hooks enthält. Das geht zwar super schnell und ist vermutlich für kleine Plugins ok, da wir aber etwas anderes im Sinn haben, werden wir das in diesem Schritt ändern.

In diesem Beitrag gehe ich Schritt für Schritt durch, wie ich das bestehende Plugin sauber aufteile in:

• Backend
• Frontend
• Logik

Das Ziel: klare Trennung von Verantwortung, bessere Wartbarkeit und sauberes WordPress-Best-Practice.

Zielstruktur des Plugins

Wir bauen aus dem bestehenden Plugin folgende Struktur:

basix-tracker/
│
├── basix-tracker.php
│
├── includes/
│   └── functions.php
│
├── admin/
│   ├── admin-hooks.php
│   └── admin-template.php
│
├── public/
│   ├── frontend-hooks.php
│   └── frontend-template.php

Trennung von Logik und UI

Im ersten Schritt entfernen wir den gesamten Code aus unserer Hauptdatei. Diese ist ab jetzt nur mehr für das Laden zuständig:

<?php
/*
 * Plugin Name: Basix Time Tracking
 * Description: A simple time tracking plugin for WordPress.
 * Version: 0.1.1
 */

define( 'BASIX_PLUGIN_PATH', plugin_dir_path( __FILE__ ) );
define( 'BASIX_PLUGIN_URL', plugin_dir_url( __FILE__ ) );

// Core functions
require_once BASIX_PLUGIN_PATH . 'includes/functions.php';

// Admin-only
if ( is_admin() ) {
    require_once BASIX_PLUGIN_PATH . 'admin/admin-hooks.php';
}

// Frontend-only
if ( ! is_admin() ) {
    require_once BASIX_PLUGIN_PATH . 'public/frontend-hooks.php';
}

Noch ungenutzt in dieser Version ist der includes Ordner. Die functions.php wird später den Code beinhalten den ich sowohl im Frontend als auch im Backend nutzen möchte. Das werden Dinge sein wie:

• Datenbankzugriff
• Helper-Funktionen
• Validierung

Die admin-hooks.php enthält ab jetzt nur mehr die Logik, während die admin-template.php den HTML Code beinhaltet. So ist alles getrennt und bleibt einfacher wartbar und macht es uns später einfacher mit Änderungen.

Admin Logik (admin-hooks.php)

<?php
add_action('admin_menu', 'basix_tracker_add_admin_menu');
add_action('admin_init', 'basix_tracker_settings');

function basix_tracker_add_admin_menu() {
    add_menu_page(
        'Basix Time Tracking', // Page Title
        'Basix Tracker', // Menu Title
        'manage_options', // Capability
        'basix-tracker', // Menu Slug
        'basix_tracker_admin_page', // Callback Function
        'dashicons-clock', // Icon
        6 // Position
    );
}

function basix_tracker_admin_page() {
     include BASIX_PLUGIN_PATH . 'admin/admin-template.php';
}

function basix_tracker_settings() {
    register_setting('basix_tracker_settings_group', 'basix_tracker_dummy_setting');

    add_settings_section(
        'basix_tracker_settings_section',
        'Basix Tracker Settings',
        null, // callback function
        'basix-tracker'
    );

    add_settings_field(
        'basix_tracker_dummy_setting',
        'Dummy Setting Name',
        'basix_tracker_dummy_setting_render',
        'basix-tracker',
        'basix_tracker_settings_section'
    );
}

function basix_tracker_dummy_setting_render() {
    $value = get_option('basix_tracker_dummy_setting', '');
    ?>
    <input type="text" name="basix_tracker_dummy_setting" value="<?php echo esc_attr($value); ?>" />
    <?php
}

Admin UI (admin-template.php)

    <div class="wrap">
        <h1>Basix Time Tracking</h1>
        <p>Welcome to the Basix Time Tracking plugin admin page.</p>
        <h2>Settings</h2>
         <form method="post" action="options.php">
            <?php
                settings_fields('basix_tracker_settings_group');
                do_settings_sections('basix-tracker');
                submit_button();
            ?>
        </form>
        <!-- Additional plugin functionality can be added here -->
    </div>

Das Frontend ist im Moment auch noch leer und nur als Shortcode verfügbar. Dazu benötigen wir folgendes:

Frontend Logik (frontend-hooks.php)

<?php
add_shortcode( 'basix_tracker', 'basix_tracker_shortcode' );

function basix_tracker_shortcode() {
    ob_start();
    include BASIX_PLUGIN_PATH . 'public/frontend-template.php';
    return ob_get_clean();
}

Frontend UI (frontend-template.php)

<div class="basix-frontend">
    <h2>Basix Time Tracker</h2>
    <p>This is the frontend display of the Basix Time Tracking plugin.</p>
    <!-- Additional frontend functionality can be added here -->
</div>

Damit können wir jetzt auf jeder beliebigen Seiten den Shortcode [basix_tracker] verwenden um unser Frontend anzuzeigen.

Fazit

Durch das Aufsplitten eines bestehenden Plugins haben wir jetzt also folgendes:

• Klaren, wartbaren Code
• Saubere Trennung von Logik und Darstellung
• Bessere Performance (kein unnötiger Code)
• Leichtere Erweiterbarkeit

Gerade bei wachsenden Plugins ist diese Struktur kein Luxus, sondern notwendig.