Grundstruktur

Ein WBCE-Template besteht aus wenigen Pflichtdateien und beliebig vielen optionalen Dateien. Hier lernst du den Mindestaufbau kennen.

Pflichtdateien

mein_template/
├── info.php        ← Pflicht: Name, Version, Autor
├── index.php       ← Pflicht: HTML-Grundgerüst
└── css/
    └── style.css   ← Empfohlen: Stylesheet

info.php

Die info.php beschreibt das Template:

<?php
$template_name        = 'Mein Template';
$template_version     = '1.0.0';
$template_platform    = '1.6';
$template_author      = 'Dein Name';
$template_license     = 'GNU General Public License';
$template_description = 'Beschreibung des Templates';

index.php — das Grundgerüst

Die index.php ist das HTML-Grundgerüst. Sie enthält alle WBCE-Hooks:

<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="utf-8">
    <title><?php page_title(); ?> - <?php echo WEBSITE_TITLE; ?></title>
    <?php register_frontend_modfiles('css'); ?>
</head>
<body>

    <header>
        <h1><?php echo WEBSITE_TITLE; ?></h1>
        <?php show_menu2(); ?>
    </header>

    <main>
        <?php page_content(1); ?>
    </main>

    <aside>
        <?php page_content(2); ?>
    </aside>

    <footer>
        <?php page_footer(); ?>
    </footer>

    <?php register_frontend_modfiles('js'); ?>

</body>
</html>

Blöcke definieren

Blöcke sind die Bereiche wo WBCE Abschnitte platziert. Sie werden durch page_content($block_id) definiert:

<?php page_content(1); ?>  // Block 1 — Hauptinhalt
<?php page_content(2); ?>  // Block 2 — Sidebar
<?php page_content(3); ?>  // Block 3 — Footer-Inhalt

Wie viele Blöcke und wo sie liegen entscheidest du als Template-Entwickler.

CSS einbinden

// Im <head> — Modul-CSS laden:
<?php register_frontend_modfiles('css'); ?>

// Eigenes Stylesheet:
<link rel="stylesheet" href="<?php echo TEMPLATE_DIR; ?>/css/style.css">

JavaScript einbinden

// Vor </body> — Modul-JS laden:
<?php register_frontend_modfiles('js'); ?>

// Eigenes JavaScript:
<script src="<?php echo TEMPLATE_DIR; ?>/js/main.js"></script>

Nächster Schritt: HTML-Vorlage konvertieren — bestehendes Design zu WBCE machen