SPIP-definierte Stile
Wie Sie nun wissen, ermöglichen Stylesheets, graphische Definitionen zu zentralisieren und sehr viel einfacher zu verwalten, als wenn man sie direkt in den HTML-Code schreibt. Dies macht den Nutzen der Verwendung von CSS aus, die allerdings nicht unbedingt erforderlich ist: Sie können weiterhin hier und da in Ihrem HTML-Code graphische Definitionen schreiben, auch wenn Sie gleichzeitig ein Stylesheet verwenden.
Bei SPIP haben Stylesheets eine zusätzliche Funktion: sie werden benutzt, um die graphischen Definitionen von Elementen zu editieren, die in Ihrem HTML-Code (dem Code Ihres Skelettes) nicht definiert sind! Tatsache ist, daß SPIP selbst automatisch eine erhebliche Anzahl von verschiedenen Abbildungs-Stilen erzeugt. So werden die typographischen Abkürzungen von SPIP (für Hypertext-Links, Untertitel, Fett- und Kursiv-Styles, Tabellen usw.) in HTML-Code umgewandelt, damit der Webbrowser sie auf dem Bildschirm darstellen kann. Das geschieht auch bei automatischen Formularen (Forum-Posting, Petitions-Unterzeichnung usw.) und in ähnlichen Fällen.
Um Sie in die Lage zu versetzen, die graphische Anzeigeform dieser Stile zu ändern, gibt SPIP ihnen bestimmte und festgelegte Namen (eine Liste dieser Namen finden Sie in
«SPIP und die Stylesheets»). Beispielsweise erzeugt {{{subheadings}}} nicht ein einfaches
<h3>-Tag, sondern ein <h3 class="spip">-Tag. Welche Vorteile hat das? Derartige Tags haben einen bestimmten Namen in ihrem
class-Attribut. Dieser Name definiert die «Klasse», zu der Untertitel gehören, das heißt eine Anzahl von HTML-Elementen, die gemeinsam die graphischen Eigenschaften erben, die für diese Klasse im Stylesheet definiert sind.
So weit, so gut; und wie ändere ich nun das Erscheinungsbild aller SPIP-Untertitel? Sehr einfach — alles was Sie tun müssen, ist, Ihre meine_styles.css-Datei (wenn Sie ihr diesen Namen gegeben haben) in einem beliebigen Texteditor zu öffnen und die folgenden Zeilen hinzuzufügen:
h3.spip {
color: red;
font-size: 18px;
}Laden Sie nun die Seite neu, und alle SPIP-Untertitel werden wie von Zauberhand rot dargestellt. Beachten Sie, daß die anderen <h3>-Tags in Ihrer Seite, falls es solche gibt, nicht rot dargestellt werden. Wenn nichts derartiges zu sehen ist, prüfen Sie, ob Sie das Stylesheet im Skelett (innerhalb des <head>-Tags, wie es im vorhergehenden Artikel beschrieben ist) deklariert haben, und laden Sie die Seite neu.
Lassen Sie uns kurz die Syntax dieser Seitendarstellungs-Deklaration erklären:
- h3.spip, direkt vor den geschweiften Klammern, bedeutet, daß die Deklaration nur bei <h3>-Tags mit einem class-Atrribut Anwendung findet, das den Namen "spip" trägt. Beachten Sie bitte: weder <h3>-Tags ohne ein class-Attribut noch <h3>-Tags mit einem class-Attribut anderen Namens noch Tags mit einem class-Attribut dieses Namens, die keine <h3>-Tags sind, werden beeinflußt.
- Geschweifte Klammern umschließen
die Liste von graphischen Definitionen, die mit dem jeweiligen Stil verbunden sind. Beachten Sie, daß alle in dieser Liste nicht definierten Eigenschaften für das in Frage stehende Tag ihre Originalwerte behalten. Im vorliegenden Falle wird das <h3>-Tag einen Text immer im Stil "bold" darstellen, da nichts in dieser Stil-Definition etwas anderes bestimmt.
- Die aufgelisteten und in Schweifklammern gesetzten Eigenschaften werden durch ein Semikolon getrennt oder abgeschlossen. Eine Eigenschaft besteht aus einem Namen (diese Namen sind durch die CSS-Sprache standardisiert), gefolgt von einem Doppelpunkt und einem Wert oder mehreren Werten. Hier sehen wir, daß die Farbe auf Rot gesetzt wird und die Schrift in einer Größe von 18 Pixeln dargestellt werden soll.
Wichtig: wenn Sie Ihre eigenen Stile hinzufügen, müssen Sie daran denken, daß der Name, der dem
class-Attribut gegeben wird, völlig willkürlich gewählt werden kann. Ihrem Browser ist es egal, ob dieses Attributspipheißt,menu-sectionsoderkarl_napp. Es kommt nur darauf an, daß dieser Name mit der Deklaration korrespondiert, die Sie in Ihrem Stylesheet angegeben haben.
Wie Sie bemerkt haben werden, ist die CSS-Sprache sehr einfach und direkt und benutzt dieselbe Art von Vokabular wie klassisches HTML. Auf Ihrer Reise durch CSS werden Sie Dingen begegnen, die mehr oder weniger aus HTML-Code stammen, wie z.B. border, width, height etc.).
Verwaltung des Cache
Die Tatsache, daß Ihr Stylesheet (das inzwischen berühmte
meine_styles.css) in einer separaten Datei definiert ist, ist von großer Wichtigkeit. Im Gegensatz zu Ihren Templates wird diese Datei nämlich von SPIP, das sie nicht braucht, nicht verwaltet. Daraus folgt, daß Sie den Cache von SPIP nicht leeren müssen, wenn Sie Ihr Stylesheet editiert haben - Sie müssen nur Ihre Seite in Ihrem Browser neu laden. Das macht das Einstellen der Seitendarstellung noch einfacher.
Lassen Sie uns nur noch daran erinnern, daß Ihr Stylesheet in Ihren HTML-Dateien deklariert (das heißt mit ihnen verlinkt) sein muß, und daß diese Dateien einmal regeneriert werden müssen, damit diese Deklaration zur Kenntnis genommen wird: die Zeile <link rel="stylesheet" type="text/css" href="meine_styles.css"> muß sich «im Cache befinden», damit der Browser an sie herankommt.