1.Issue 7:Der einfache Weg der Themengestaltung
1.1.Grundlagen derThemengestaltung
1.2.Themen-Untersuchung
1.3.Unterschiedliche Arten der Stile
1.4.phpWebSite StyleSheets
1.4.1.theme.ini
1.4.2.style.css
1.4.3.basic.css
1.4.4.default.css
1.4.5.position.css
1.4.6.andere
1.4.7.StyleSheets der Module
1.4.8.Ein Beispiel, aufgelöst
1.5.Schlussbemerkungen
Forum thread link

1.4.phpWebSite StyleSheets

Wie bereits erwähnt, hat phpWebSite einige StyleSheets im Thema.

1.4.1.theme.ini

Ist eine wichtige Datei zur Steuerung, welche Css Dateien existieren und wie sie benutzt werden.

1.4.2.style.css

Ist das hauptsächliche StyleSheet mit dem Zweck, weitere StyleSheets einzubinden. Der Import von basic.css und position.css ist durch dieses style.css verusacht.

1.4.3.basic.css

Hauptsächlich, aber nicht ausschliesslich für Xhtml auszeichnungsorientierte Zuordnungen der Stil Eigenschaften. basic.css wird durch style.css zuerst importiert.

1.4.4.default.css

Ist der richtige Ort für Css Klassen Zuordnungen für das gesamte Thema. Ist, wie in theme.ini deklariert, als bevorzugtes style sheet verknüpft, weil kein Titel zugeordnet ist.

1.4.5.position.css

Ist der hauptsächliche Platz zur Steuerung der Css Boxen in Grössen und Positionen. position.css ist durch style.css as zweites css importiert. Das bedeutet in der Kaskade, es hat Priorität gegenüber dem ersten (basic.css).

1.4.6.andere

Variieren ..., manche sind für dynamische Zuordnungen während des Betriebes von phpWebSite, beispielsweise mit Layout-Manager oder Mini-Admin. Das ist noch nicht alles.

1.4.7.StyleSheets der Module

Jedes Modul kann auch mit eigenen StyleSheets ausgeliefert werden, die teilhaben in der Kaskade der Stile. Jene sind ursprünlich im module Ordner zu finden, statt im theme Ordner und werden bei der Modul Installation nach templates/module kopiert. Der Platz für dauerhafte Änderungen, die eine De-Installations des Moduls überleben sollen, ist also module/template (und nicht template/module), das nur für das aktivierte Modul gilt und einen Schutz beim Update des Moduls bietet.

Mancheiner wird dabei Widersprüche zur themenorientierten Gestaltung empfinden. Die Widersprüche scheinen zu sein: Module haben eingenes style.css im template Unterverzeichnis; während der Modulinstallation wird dieser template Unterordnerduring kopiert von site/mod/themodule/templates nach site/templates/themodule; weder site/mod/themodule/templates, noch der site/templates/themodule Ordner gehören zum site/theme (Ordner); Änderungen in site/mod/themodule/templates gelten nicht für das gegenwärtig installierte Modul - während Änderungen in site/templates/themodule gelten, aber dann verschwinden, wenn das Modul deinstalliert wird. Änderungen in beiden Quellen vorzunehmen ist keine Lösung, weil Modul Aktualisierungen die eigene schwere Arbeit überschreibt. Aber es gibt eine Lösung, eine leichte Lösung: zu berücksichtigen ist, Gestaltung im Allgemeinen gehört immer in ein Thema. Die Themen haben einen Platz in der Ordnerhierarchie, der während der Modulinstallation nicht berührt wird. Eigene Änderungen an den modulspezifischen Gestaltungseigenschaften sind also in einem Css des Themas zu platzieren, beispielsweise default.css. Die Kunst dabei ist, die richtigen Spezifikationen in dem Themen Css zu kodieren. Das hört sich komplex an, ist es aber nicht. Ein einfaches Beispiel:

ControlPanel (ein Modul das nicht in Gefahr gerät zu oft deinstalliert zu werden) hat ein site/mod/controlpanel/templates/style.css das nach site/templates/controlpanel/style.css kopiert ist von wo es angewendet wird. Um die Eigenschaften der Verweistitel in den Reitern von ControlPanel zu ändern, ist das Css zu untersuchen (an fireBug sei erinnert) welche Spezifika referenziert sind; das ist beispielsweise ein "div.link a { ...}". Nun können wir die Deklaration in default.css des Themas reinstellen, um mit den sicher zuvor geänderten Werten wirksam zu werden. Weil default.css des Themas Priorität vor den Modul Css hat, sind unsere Änderungen die Gewinner (wenn das Thema benutz wird).

1.4.8.Ein Beispiel, aufgelöst

Jedes laufende phpWebSite Portal hat ein generiertes Quellen Xhtml wie

:
<style type="text/css"> @import url("templates/controlpanel/style.css");</style>
<style type="text/css"> @import url("templates/menu/style.css");</style>
<style type="text/css"> @import url("templates/openid/style.css");</style>
<style type="text/css"> @import url("themes/dc1/style.css")screen;</style>
<link rel="stylesheet" title="Default_Delite" href="themes/dc1/default.css" type="text/css" />
<link rel="alternate stylesheet" title="Blue" href="themes/dc1/blue.css" type="text/css" media="print, screen" />
<link rel="stylesheet" href="themes/dc1/print.css" type="text/css" media="print" />
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="themes/default/hacks.css" />
<![endif]-->
:

Ganz oben ist zu sehen, die Modul Css sind zuerst genannt, was zur Platzierung ganz unten in der kaskadierenden Pyramide führt. Weiter unten (mit steigender Priorität) folgt das themeenorientierte style.css (welches basic.css und position.css importiert), gefolgt vom themenorientierten default.css, und endend mit einigen Spezialitäten für die Fehlverhalten des IE.

1.5.Schlussbemerkungen

Was auch immer (einfach oder komplex) genutzt, zugeordnet und kaskadiert wird, mit einem Werkzeug wie FireBug und den gezeigten Beispielen hoffe ich ein wenig zu den Möglichkeiten der Themengestaltung hingeführt zu haben. Vielleicht hilft das in der Zukunft auch ein wenig dabei, eine wachsende Anzahl gut gestalteter Themen für phpWebSite 1.x.x zu sehen.

Forum thread link

Any remarks, questions etc about the article are requested to the associated sourceforge forum thread.