Designpattern für ein übersichtliches und flexibles CMS Theme
Mit diesem Design Pattern schreiben Sie gute Themes die Sie auch noch in vielen Jahren weiter Ausbauen können. Erzeugen Sie einfache modulare Komponenten.
Mit diesem Design Pattern schreiben Sie gute Themes die Sie auch noch in vielen Jahren weiter Ausbauen können. Erzeugen Sie einfache modulare Komponenten.
Anker Power Expander - DAS ANKER PLUS Schließe dich den über 50 Millionen glücklichen Kunden an. DUALE LEISTUNG Jeweils ein SD und ein microSD Speicherkartensteckplatz machen die Datenübertragung und -verwaltung zum Kinderspiel. BLITZSCHNELLER DATENTRANSFER Genieße dank dem hochmodernen UHS-II Speicherkartensteckplatz eine Datenübertragung mit einer Geschwindigkeit von bis zu 312 MBps. Hinweis
kaufen...Die Übersichtlichkeit des Programmcodes in Themes ist maßgeblich entscheidend für die gute Wartbarkeit und langlebige Pflege des Codes. Ist der Code gut strukturiert, leicht wiederverwendbar und logisch aufgebaut, dann haben Sie lange etwas von diesem Theme und können es leicht über lange Zeit weiterentwickeln.
Als zentralen Ausgangspunkt für die Entwicklung eines eigenen Theme sollten Sie sich in Ihrem CMS den Loop suchen. Der Loop ist nichts anderes als die zentrale Stelle an der die Beiträge des Posts verarbeitet und angezeigt werden - also das Herz der Content-Darstellung. Als Beispiel habe ich den Loop des Bludit CMS gewählt, da dieser bereits schon gut strukturiert ist.
... ...
001 <body>
002
003 <?php include(THEME_DIR_PHP.'navbar.php'); ?>
004
005 <?php
006 if ($WHERE_AM_I == 'page') {
007 include(THEME_DIR_PHP.'page.php');
008 }
009 elseif ($WHERE_AM_I=='home') {
010 include(THEME_DIR_PHP.'home.php');
011 }
012 elseif ($WHERE_AM_I=='tag') {
013 include(THEME_DIR_PHP.'home.php');
014 }
015 elseif ($WHERE_AM_I=='category') {
016 include(THEME_DIR_PHP.'category.php');
017 }
018 ...Ich denke, das der oben gezeigte Code Auszug durchaus schon sehr sprechend ist und deutlich macht, was im Theme abläuft. In den Zeilen 006, 009, 012 und 015 ruft das Framework des CMS jeweils ein Sub-Template für die jeweilige Funktion der Startseite (home.php), einer Beitragsseite (page.php), für die Anzeige von Schlagworten (tag.php) und der Anzeige einer Kategorie (category.php) auf.
Zwar sind diese im CMS Bludit vollständig mit Heading, Navbar, Content und Footer implementiert, jedoch ist dies wenig modular bzw. Komponentenbasiert. Statt dessen sollten Sie kleinere Module bilden und Kopf- und Fußzeilen als einzelne Module ausführen, wie es im folgenden Coding der Fall ist.
001 ...
001 <body>
001
001 <?php include(THEME_DIR_PHP.'navbar.php'); ?>
001
001 <?php
001 if ($WHERE_AM_I == 'page') {
001 include(THEME_DIR_PHP.'inc-header-page.php'); // Kopf
001 include(THEME_DIR_PHP.'inc-affiliate.php'); // Affiliate Banner
001 Theme::plugins('pageBegin'); // Plugins des Hook pageBegin() starten
001 include(THEME_DIR_PHP.'page.php'); // Der Content
001 include(THEME_DIR_PHP.'inc-sub-post.php'); // Seiten mit enthaltenem Tag
001 include(THEME_DIR_PHP.'inc-relatet-posts.php'); // Seiten die untergeordnet sind
001 Theme::plugins('pageEnd'); // Plugins des Hook pageEnd() starten
001 include(THEME_DIR_PHP.'inc-about-user.php'); // Avatar und Bio anzeigen
001 }
001 elseif ($WHERE_AM_I=='home') {
001 include(THEME_DIR_PHP.'inc-header-home.php'); // Kopf
001 Theme::plugins('pageBegin'); // Plugins des Hook pageBegin() starten
001 include(THEME_DIR_PHP.'home.php'); // Die HOME-Seite
001 include(THEME_DIR_PHP.'inc-taglist.php'); // Liste aller TAGs im CMS
001 include(THEME_DIR_PHP.'inc-slug-banner.php'); // Banner in des betreffenden SLUG
001 Theme::plugins('pageEnd'); // Plugins des Hook pageEnd() starten
001 include(THEME_DIR_PHP.'inc-about-user.php'); // Avatar und Bio anzeigen
001 }
001 elseif ($WHERE_AM_I=='tag') {
001 include(THEME_DIR_PHP.'inc-header-tag.php'); // Kopf
001 include(THEME_DIR_PHP.'inc-affiliate.php'); // Affiliae Banner
001 Theme::plugins('pageBegin'); // Plugins des Hook pageBegin() starten
001 include(THEME_DIR_PHP.'tag.php'); // Liste alle Posts zu diesem TAG
001 Theme::plugins('pageEnd'); // Plugins des Hook pageEnd() starten
001 include(THEME_DIR_PHP.'inc-about-user.php'); // Avatar und Bio anzeigen
001 }
001 elseif ($WHERE_AM_I=='category') {
001 include(THEME_DIR_PHP.'inc-header-category.php'); // Kopf
001 Theme::plugins('pageBegin'); // Plugins des Hook pageBegin() starten
001 include(THEME_DIR_PHP.'category.php'); // Anzeige der Kategorie enthaltenen Posts
001 include(THEME_DIR_PHP.'inc-taglist.php'); // Liste aller TAGs im CMS
001 include(THEME_DIR_PHP.'inc-slug-banner.php'); // Banner in des betreffenden SLUG
001 Theme::plugins('pageEnd'); // Plugins des Hook pageEnd() starten
001 include(THEME_DIR_PHP.'inc-about-user.php'); // Avatar und Bio anzeigen
001 }
001 ?>
001
001 <?php include(THEME_DIR_PHP.'footer.php'); ?>
... ...
001
001 </body>
001 </html>Module beginnen in diesem Codebeispiel mit INC-xxx, da sie im wesentlichen als Include genutzt werden
Für die Anzeige des Headers der Seite wurde ein eigenes Modul (inc-XXX.php) entwickelt - es hat nur eine Hand voll Zeilen. Dieses Modul ist jedem Start einer Seite, einer Kategorie oder der Tag-Liste vorgeschaltet. Im Anschluss daran folgt ein Affiliate-Modul, die Plugins des CMS werden eingebunden und dann der eigentliche Content wie es auch im originalen Loop im Abschnitt davor zu sehen war.
Nach Anzeige des eigentlichen Content endet die Seite unterschiedlich mit Tagliste, Banner und den Plugins die am Ende der Seite gestartet werden sollten.
Wenn Sie sich den Code oben ansehen, haben Sie sehr schnell einen guten Überblick über den Aufbau des Themes. Sie wissen sehr genau was passiert, wenn ein Leser eine Kategorie anklickt, oder einen Beitrag liest. Die Struktur der Anzeige steht übersichtlich in nur wenigen Zeile Code Ihres Themes.
Aufgaben sind modularisiert und können leicht umgestellt oder deaktiviert werden. Sie haben das Theme auf diese Art und Weise stärker abstrahiert und erledigen Aufgaben durch Module bzw. Komponenten die leicht wiederverwertet werden können.
Die Programmstruktur ist imens wichtig wenn Sie ein gutes Theme schreiben wollen. Ordnen Sie den Code nach FUnktionsgruppen, bilden Module mit weiderkehrenden Aufgaben für die mehrfache Verwendung an verschiedenen Stellen. Bevor Sie zu große Programmblöcke schreiben, überlegen Sie, ob sich dieser nicht besser in mehrere Module oder Komponenten zerteilen lässt.
Passend:
Die Formularverarbeitung durch PHP ist der beliebteste Standard im Web. Nutzen Sie ein intelligentes Design, können Sie sich viel Arbeit und Stress ersparen.
So steuern Sie die Templatevorgabe in Beiträgen mit dem CMS Bludit. Sie können den Tamplatenamen bei der Erstellung von Beiträgen im Backend angeben.
Teil 3 - Ein GetSimple Template erstellen. In Verbindung mit dem freien und beliebten CSS-Framework Bootstrap eine leichte Sache auf dem Weg zum eigenen Blog.
Möchten Sie Themes, Layouts und Designs erstellen die auf hohe Akzeptanz beim Besucher stoßen, dann sollten Sie sich zuvor diesen Styleguide durchlesen.
Lesen Sie im GetSimple CMS alle Posts und Beiträge auf der Startseite mit dem Beitrags-Loop einzeln aus, der Beitrag zeigt Ihnen wie einfach das geht.
Der aktuelle Index des Pico Loops kann für die Steuerung unterschiedlicher Formate abgefragt werden, nutzen Sie das Tag loop.index der Twig Template Engine.
Werten Sie in eigenen Templates mit der Template-Engine Smarty, Variablen aus und steuern dadurch die individuelle Ausgabe des Content Ihrer Webseite.