Solaranlage.org
Die Internetseite solaranlage.org nutzt das Wordpress-Theme Thesis, ein neues und sehr gerne genutztes Layout mit vielen Einstellungsmöglichkeiten. Dieses Theme ist so flexibel und vielseitig wie kaum ein anderes und besticht durch seine lesefreundliche Typographie und einfache Bedienung. Ein Blick in die CSS-Dateien des Themes verrät warum dies so ist:
Prinzipiell verfügt das Theme über mehrere, unterschiedliche CSS-Dateien mit unterschiedlichen Aufgabenbereichen:
1) Die Datei style css definiert das optische Auftreten der Seite. Hier werden die Farben der Schrift, der Links, der Rahmen um die Bilder und die Hintergrundfarben festgelegt.
2) In einer zweiten Datei mit dem Namen layout.css werden dann die einzelnen Layoutelemente nach ihrer Größe definiert: Für Bereiche wie z. B. #container, #page, #header, #footer, #content_box, #sidebar oder #footer werden die Ausmaße, die das optische Erscheinungsbild festlegen (width, font-family, font-size etc.) definiert.
3) In der dritten Datei custom.css sind die variablen Eigenschaften des Themes eingetragen. Um diese Datei zu verwenden, muss sie im Adminbereich von Wordpress zunächst ein Mal freigeschalten werden. Danach können mit Hilfe dieser Datei die vorgegebenen Grundeinstellungen überschrieben werden.
Diese Möglichkeit funktioniert mithilfe eines einfachen Prinzips: Das Theme fügt in dieser Datei den einzelnen Elementen die Klassen .custom bei. Also z. B. a.custom für die Links oder #header..custom für den Kopf der Seite. Werden nun diese Klassen in der customs.css definiert und – durch die Aktivierung der custom.css im Backend – auch tatsächlich abgerufen, dann erreicht den Browser wenn er ein Element wie z. B. einen Link untersucht, eine spezifische Information, nämlich die der jeweiligen Klasse. Da die allgemeinen CSS-Regeln vorsehen, dass immer die spezifischsten Informationen verwertet werden, interpretiert der Browser das Element so, wie es die Klasse der Datei custom.css vorsieht.
Durch diese Form des CSS-Codes besteht die Möglichkeit Änderungen im optischen Auftreten sehr schnell und ohne CSS-Kenntnissen um zu setzen.