Hallo Foren-Gemeinde,
ich möchte gerne für jedes Thema einer Hauptnavigation ein eigenes Farbschema verwenden.
Ich habe hierzu verschiedene CSS-Files gebaut, die ich in die einzelnen Seiten meines Seitenbaumes
durch Erweiterungs-Templates einbaue.
Das klappt auch so wie erwartet.
Mein Problem ist nun banal: Da ich für jedes Thema der Hauptnavigation immer wieder ein abgewandelte
Kopie der CSS benutze, muss ich nun bei jeder Änderung des Designs jede einzelne CSS-Datei anfassen
und ändern - mit dem entsprechenden Fehlerpotionzial.
Nun meine Frage: Gibt es in Typo3 die Möglichkeit, im Haupttemplate eine CSS-Datei einzubinden, die
alle wesentlichen Merkmale entält und in den einzelnen Menüthemen nur eine zusätzliche CSS-Datei, die
nur die Farbangaben enthält anzugeben?
Die "unteren" CSS-Dateien sollen sich also zu der Haupt-CSS "addieren" (Ich hoffe, Ihr versteht, was ich meine :-) ).
Vielen Dank für Eure Unterstützung!
Torsten
Es gibt auch die Möglichkeit Seiten ein Layout zuzuweisen dann brauchst Du keine Erweiterungstemplates (Seiteneigenschaften bearbeiten > Erscheinungsbild > Frontend-Layout auswählen) Diese kannst Du dann jeweils mit einer body id versehen. CSS dann entsprechend anpassen. Du kannst natürlich auch entsprechend nur die CSS Dateien laden
Achtung TSFE : page ohne Leerzeichen vor dem Doppelpunkt
[globalVar=TSFE : page|layout=1]
page {
bodyTag = <body id="colorOne">
}
[global]
[globalVar=TSFE : page|layout=1]
page.includeCSS {
10 = fileadmin/default/templates/css/colorOne.css
10.media = screen
}
[global]
Danke für Deinen Tipp, das ist aber nicht genau das was ich suche.
Ich möchte gerne ein "Ober"-CSS, das alle wesentlichen Bestandteile enthält.
Dann möchte ich je Menüpunkt eine zusätzlich (!) CSS laden, die nur die
Erweiterungen enthält, die in dem jeweiligen Kontext gelten.
Deine Variante habe ich bereits am Laufen. Ich möchte aber die zentralen
Elemente halt nur an einer Stelle ändern müssen.
Gruß
Torsten
Ne so richtig versteh ich das Problem noch nicht. Ich würde ein Root-Template anlegen und dort die Conditions setzen
# die "Ober"-CSS
# enthält alle wesentlichen Bestandteile
page.includeCSS {
10 = fileadmin/default/templates/css/main.css
10.media = screen
20 = fileadmin/default/templates/css/print.css
20.media = print
}
# Conditon setzen http://wiki.typo3.org/wiki/index.php?title=De:TSrefConditions
# wenn Seitenlayout 1 des Menüpunkts ausgewählt ist
# lade zusätzlich diese CSS
[globalVar = TSFE : page|layout = 1]
page.includeCSS {
30 = fileadmin/default/templates/css/extra.css
30.media = screen
# ...
}
[global]
Hallo somaberlin,
hier ein Beispiel von dem, was ich meine:
Haupt-CSS:
-----------------------
body {
background-color: #FFF;
}
#id {
font-size: 12px;
color: #000;
}
#container {
background-color: #FFF;
}
-----------------------
Jetzt die CSS für die 1. Unterseite:
-----------------------
#container {
background-color: #F00;
}
-----------------------
Und hier die CSS für die 2. Unterseite:
-----------------------
#container {
background-color: #0F0;
}
-----------------------
usw.
Im Endergebnis soll die Hapt-CSS für alle Seiten und die jeweiligen Unter-CSS ergänzend nur bei den Unterseiten gelten und die ID "container" der Haupt-CSS ersetzen.
Nun klar?
Gruß
Torsten
Hab das nicht getestet, aber wenn eine Seite zwei CSS Dateien enthält, die beide die id #container enthalten dann werden die Anweisungen der letzten CSS ausgeführt.
<head>
<link type="text/css" href="fileadmin/tlp/css/main.css" />
<link type="text/css" href="fileadmin/tlp/css/unterseite.css" />
</head>
möglich wäre dann auch noch für das CSS der 2. Unterseite:
#container {
background-color: #0F0 !important;
}
Aber vielleicht verstehe ich auch einfach nicht was Du vor hast. Sorry
Oben ist doch schon das Beispiel mit page.includeCSS mit mehreren Dateien. Damit kannst Du doch genau das machen?
Hi All,
ich habe es mittlerweile herausgefunden.
In einem Erweiterungs-Template kann ich eine
weitere CSS einbinden. Tatsächlich werden
dann ja beide Templates geladen und es werden
auch beide CSS geladen, die kumulativ genutzt
werden. Genau das was ich wollte.
Vielen Dank Euch für den Support
Gruß
Torsten
Alternativ könnte man das vielleicht auch mit den Seiten-Resourcen sprich dem media-Feld und Slide machen können. Das hätte dann den Vorteil, dass für einzelne Verzweigungen ein vererbbares CSS angegeben werden kann.