Bludit Themegestaltung - WHERE_AM_I

Mit der neuen Version 2 von Bludit haben sich einige Dinge bei der Theme Entwicklung geändert. So gibt es im System nur noch einen Inhaltstyp, den ich statisch als Seite oder dynamisch als Blogbeitrag anzeigen lassen kann. Durch diese Tatsache gibt es auch die Unterscheidung der Ausgabe "Page" und "Post" aus Version 1 nicht mehr. Es ist aber dennoch möglich, sich für die unterschiedlichen Inhaltstypen, unterschiedliche Layouts zu erstellen. Der Schlüssel dazu ist die Variable "$WHERE_AM_I".

Bei den meisten Themes welche als Blog betrieben werden können gibt es zwei Ausgabe Dateien. Das ist die Datei home.php und die Datei page.php. home.php ist für die Startseite und die Übersichtsseiten der Kategorien und Schlagworte zuständig. Die Datei page.php ist dann für die einzelnen Seiten, egal ob statisch oder dynamisch zuständig. Dynamisch sind in diesem Fall dann die Blogbeiträge. Oftmals ist es allerdings so, dass ich bei einer statischen Seite nicht die Überschrift, den Autor und das Erstellungsdatum anzeigen lassen möchte, was ich bei einem Blogbeitrag aber schon machen will. Zudem soll meine Übersichtsseite der Kategorien und meiner Schlagworte anders aussehen als meine Startseite, auf der ich vielleicht auch noch einen "Featured Post" habe.

Dies ist alles mit der eingangs erwähnten Variable "$WHERE_AM_I" möglich. Das System frag dazu ab, wo auf der Seite ich mich befinde, und gibt dann, entsprechend den Vorgaben, den Inhalt auf der jeweiligen Seite aus. Um das bisher geschriebene an einem Beispiel zu verdeutlichen, nehmen wir dieses Theme als Beispiel.
Ich habe auf Codestupser.de die Startseite mit einem "Featured Post" und sechs weiteren Artikel. Die Artikelanzahl die ausgegeben werden soll kann ich über das Backend festlegen. Dies sind meine dynamischen Seiten. In meinem Fall habe ich die Pagination weggelassen, da ich sonst auf jeder Seite einen "Featured Post" habe, was meiner Meinung nach Unsinn ist. Dementsprechend biete ich dem Nutzer nach den Artikel eine Übersicht der Kategorien und Schlagworte an, so dass er weitere Artikel suchen kann, wenn er denn will. Als Alternative könnte man auch die Anzahl der ausgegebenen Artikel erhöhen. Dies aber nur als kleine Randnotiz.
Zusätzliche zu meinen dynamischen Inhalten habe ich noch zwei statische Seiten mit dem Impressum und dem Datenschutz. Wie bereits erwähnt hat der Nutzer noch die Möglichkeit sich durch einen Klick auf ein entsprechendes Schlagwort oder auf eine Kategorie, alle Beiträge mit dem entsprechendem Schlagwort oder der entsprechenden Kategorie anzeigen zu lassen. Somit benötige ich folgende Seiten bzw. Dateien:

  • start.php zur Anzeige der Startseite
  • post.php zur Anzeige einer dynamischen Seite (Blogbeitrag)
  • page.php zur Anzeige einer statischen Seite (z.B. Impressum)
  • category.php zur Anzeige der Beiträge aus der jeweiligen Kategorie
  • tag.php zur Anzeige der Beiträge mit dem jeweiligen Schlagwort
  • home.php zur Anzeige sonstiger Beiträge die nicht den vorgenannten entsprechen

Um die Variable in das Theme einzubauen sollten wir uns noch den grundsätzlichen Themeaufbau anschauen. Hierzu gibt es eine mögliche Ordnerstruktur. Diese sollte eingehalten werden, um sogenannte "Helperclasses", die durch das CMS bereit gestellt werden, nutzen zu können. Die einzelnen Ordner und Dateien liegen in dem Hauptordner eures Themes, der im Normalfall wie euer Theme heißt, und stellt sich wie folgt da:

  • Ordner css: hier befinden sich eure Stylesheets, also die css-Dateien die das Aussehen eures Themes beeinflussen
  • Ordner img: hier befinden sich die Bilder die für das Theme benötigt werden
  • Ordner languages: hier befinden sich die Sprachdateien für euer Theme
  • Ordner php: die php Dateien für euer Theme
  • Datei index.php: die Index-Datei welche als erstes vom System aufgerufen wird und dann entsprechend die anderen php-Dateien in euer Theme einbindet und das Verhalten beeinflusst
  • Datei metadata.json: die Datei enthält Informationen zu eurem Theme und wird vom System benötigt um das Theme korrekt zu verarbeiten und zu erkennen

Weitere Informationen zum Aufbau und der Entwicklung von Themes, auch in Bezug auf die "Helperclasses", findet ihr in der Dokumentation von Bludit.

Schaltzentrale der ganzen Themegestaltung ist also die Datei "index.php". In der Datei befindet sich, vereinfacht gesagt, der Grundaufbau meiner Seite. Es werden erst die Dateien und Kommandos für der "Kopf" der Seite geladen, also Titel-Tag, Charset, CSS-Dateien, Schriften und was sonst noch benötigt wird.
Nach dem Kopfbereich kommt dann der "Body" der Seite, in meinem Fall erst einmal der Hauptcontainer der den gesamten Inhalt der Seite enthält. An dieser Stelle könnte z.B. auch mit Frameworks, etc. gearbeitet werden. Als erstes steht bei mir das Logo gefolgt von den Social Media Links, welche übrigens auch über das Backend von Bludit abgefragt werden können. Danach kommt mein Hauptinhalt, der sich je nachdem was der Nutzer anklickt ändert. An dieser Stelle im Code stehen dann die oben erwähnten unterschiedlichen Seiten und deren Verweise - realisiert über die Eingangs erwähnte Variable "WHERE_AM_I". Anbei ein Codeausschnitt des entsprechenden Bereichs um besser zu verdeutlichen was ich meine.

<main class="maincontent">
    <?php
        if($WHERE_AM_I == 'page') {
            if($Page->status() == "static") {
                include(THEME_DIR_PHP.'page.php');
            }
            else {
                include(THEME_DIR_PHP.'post.php');
            }
        } elseif($WHERE_AM_I == 'home') {
            include(THEME_DIR_PHP.'start.php');
        } elseif($WHERE_AM_I == 'category') {
            include(THEME_DIR_PHP.'category.php');
        } elseif($WHERE_AM_I == 'tag') {
            include(THEME_DIR_PHP.'tag.php');
        } else {
            include(THEME_DIR_PHP.'home.php');
        }
    ?>
</main>

So, was sagt der Code nun eigentlich? Der "main"-tag stellt den Container für die einzelnen Seiten dar. Als erstes wird dann die Unterscheidung getroffen ob es sich um eine statische oder einen dynamischen Inhalt handelt. Prinzipiell stelle ich hier wieder die Version 1 von Bludit her, indem ich eine Unterscheidung für den Inhaltstyp dynmische Beitrag - in diesem Fall einen Blogpost - oder einem statischen Beitrag - in diesem Fall z.B. die Seite Impressum - festlege.

Im Anschluss fragt das System dann ab wo es denn ist, bzw. was der Nutzer gerade angeklickt hat. Befindet sich der Nutzer auf der Startseite, also auf "home", dann soll das System die start.php aufrufen. Befindet sich der Nutzer auf in den Kategorien dann soll die category.php aufgerufen werden, usw.

Die entsprechenden Unterseiten kann ich dann im Anschluss so aufbauen, wie ich es denn gerne haben will und mittels CSS entsprechend gestalten. So habe ich eine große Einflussmöglichkeit auf die gesamte Seite. Zum einen eben über die Unterscheidung der beiden Beitragstypen, dynamisch und statisch, zum anderen kann ich jede Übersichtsseite - Kategorien, Schlagworte, Startseite - nach meinem individuellem Bedürfnis gestalten.

Ich hoffe ich konnte mit diesem Beitrag ein bisschen helfen und vielleicht ist es für den einen oder anderen nützlich. Happy Coding und viel Spaß bei der Themegestaltung mit Bludit.