Home Navigationspfeil Doku und Anleitung Navigationspfeil Template-Doku (1.1)

Dokumentation zum Template von CMBasic 1.1

Hier zeigen wir allen HTML/CSS-Profis, wie Sie Ihr eigenes Layout erstellen können. Laden Sie dafür unsere besonders vorbereiteten Musterdateien herunter.

Achtung, diese Musterdateien gelten für eine alte CMBasic-Version. Sie wurden noch nicht auf Version 1.2. umgearbeitet! Diese Anleitung finden Sie hier praktisch nur noch der Vollständigkeit halber.

Download der Templatemuster

Wir haben Ihnen zwei Musterdateien für das Layout vorbereitet. Und zwar einmal in der Standard- und einmal in der Tabellenvariante. Wir haben die Endung .html gewählt, damit Sie die jeweilige Index-Datei bequem bearbeiten können! (Später nennen Sie die Datei wieder zurück in index.php.)

HTML-Datei bearbeiten

Die index.html enthält das Standard-Layout, welches komplett durch CSS gesteuert wird. Der dazugehörige CSS-Pfad heißt css/mytemplate. Die index2.html wiederum das klassische, einfachere, Tabellen-basierte Layout. Die wesentlich einfacher aufgebaute CSS-Datei liegt unter css/mytemplate2. Die CSS-Datei heißt dabei stets cmbasic.css, von dieser Benennung dürfen Sie nicht abweichen.

Bearbeiten Sie also die Index-Datei, die Ihnen am meisten zusagt! Wenn Sie mit CSS noch nicht so vertraut sind, ist die Tabellenvariante zu empfehlen (index2.html)! Tipp: Sie können zum Bearbeiten einen guten Layout-Editor wie Dreamweaver oder den kostenfreien NVU Composer verwenden.

Beachten Sie die drei PHP-Einschübe {$title}, {$menu} und {$content}. Das sind die Stellen, an die später die Inhalte rutschen!

Und so sieht die index.html der Standard-Variante im Browser aus. Wir haben die drei PHP-Einschübe mit Pfeilen gekennzeichnet. Die dazugehörige Muster-CSS-Datei liegt, wie schon erwähnt, im Ordner mytemplate. Den Namen dieses Ordners können Sie natürlich ändern, z.B. in modern.

template1.gif

Der HTML-Quellcode

Nun können Sie den HTML-Quellcode ganz nach Belieben bearbeiten und ergänzen. Bauen Sie die Seite grafisch so auf, wie es Ihnen gefällt und wie es Ihrem Können entspricht.

Anpassen des CSS-Pfades

Außerdem müssen Sie zweimal den Pfad zur CSS-Datei anpassen. Sie müssen also den Platzhalter mytemplate bzw. mytemplate2 an zwei Stellen ggf. durch Namen Ihrer Wahl ersetzen, im Beispiel durch modern. Wir haben Ihnen diese zu ersetzende Passage durch eine rote Strichellinie gekennzeichnet.

Hinweis: Setzen Sie nach dem Bearbeiten an dieser Stelle (siehe rote Strichellinie) dann folgenden Platzhalter ein: {$cssfolder}. Auf diese Weise wird der Name automatisch eingetragen. Sie könnten zwar den Namen des Ordner auch direkt im Pfad stehenlassen. Die PHP-Einschubs-Variante ist jedoch sicherer.

template15_2.gif

Benennung auf index.php ändern

Ändern Sie Benennung von index.html bzw. index2.html zu index.php und tragen Sie in der config.inc.php den Namen Ihres CSS-Ordners ein.

$cssfolder = "modern";
template3.gif

Legen Sie die index.php in den Stammordner und legen Sie Ihren individuellen CSS-Ordner, im Beispiel modern, unter dem Pfad css ab.

© CMBasic.de