Schritt 6: Zusammenfassung

Nun können Sie beginnen weitere Stile im Administrator anzulegen. Berücksichtigen Sie dabei die Hinweise aus Teil 2 dieses Tutorials sowie diesen FAQ-Beitrag.

Ein komplexes Beispiel für Stile bei einem Projekt:

#! Bezeichnung: "Überschrift 1" BackColor:"clWhite" .editor h1.default {} #! Bezeichnung: "Titel 1" BackColor:"clWhite" .editor h1.underline { border-bottom: 1px solid; } #! Bezeichnung: "Überschrift 2" BackColor:"clWhite" .editor h2.default {} #! Bezeichnung: "Überschrift 3" BackColor:"clWhite" .editor h3.default {} #! Bezeichnung: "Überschrift 4" BackColor:"clWhite" .editor h4.default {} #! Bezeichnung: "Überschrift 5" BackColor:"clWhite" .editor h5.default {} #! Bezeichnung: "Überschrift 6" BackColor:"clWhite" .editor h6.default {} #! Bezeichnung: "Trennlinie" BackColor:"clSilver" Color:"clSilver" .editor p.separator { padding-top: 0.5em; margin-bottom: 0.5em; border-bottom: 1px solid rgb(150,150,150); } #! Bezeichnung: "Quellcode" BackColor:"255,255,180" .editor p.codesnippet { white-space: pre; color: rgb(0,0,0); background-color: rgb(255,255,180); display: block; border: dashed 1pt rgb(112,123,156); padding: 0.5em; font-family: 'Courier New'; } #! Bezeichnung: "Zitat" BackColor:"clGray" .editor span.zitat { color: rgb(80,80,80); font-style: italic; } #! Bezeichnung: "Text: rot" BackColor:"clWhite" Color:"clRed" .editor span.rot { color: rgb(255,0,0); } #! Bezeichnung: "Text: blau" BackColor:"clWhite" Color:"clBlue" .editor span.blau { color: rgb(80,80,255); } #! Bezeichnung: "Text: grün" BackColor:"clWhite" Color:"clGreen" .editor span.gruen { color: rgb(0,160,0); } #! Bezeichnung: "Text: gelb" BackColor:"clWhite" Color:"255,255,0" .editor span.gelb { color: rgb(230,230,0); } #! Bezeichnung: "Abstand rechts" BackColor:"clWhite" .editor img.abstandrechts { margin-right: 1.5em; }

Achten Sie darauf, dass die Stil-Bezeichnungen nicht zu lang werden. Das Auswahlfeld für die Stile hat eine festgelegte Breite und passt sich nicht an die von Ihnen vorgegebenen Texte an.

Fügen Sie die CSS-Klasse "editor" im HTML-Code an jeder Stelle ein an der ein Text aus einem Editor ausgegeben werden kann.

Um es den Redakteuren noch einfacher zu machen, erstellen Sie zum Abschluss noch eine kleine Liste der Stil-Bezeichnungen und deren Auswirkungen auf die Webseite. So hat es ein Redakteur von Anfang an leichter die vorgegebenen Stile zu verwenden.

Lesen Sie auch das Tutorial für Redakteure um zu sehen wie Redakteure mit Stilen arbeiten.

Haben Sie Fragen zu diesem Tutorial?
Wenden Sie sich doch an uns.

Wir würden uns außerdem freuen zu hören, wie Sie mit den Tutorials zurecht kommen.
Schicken Sie uns einfach eine Nachricht.