Hallo zusammen,
ich baue an einer T3-Seite mit Themes bootstrap_mosaic. Da ich mit .less noch keine Erfahrung habe und mir gesagt wurde, das ich die css.less mit einer eigenen CSS-Datei überschreiben kann, möchte ich dies tun.
Ich habe versucht, eigene CSS einzubauen im Setup des root-templates mit folgender Variante:
// TypoScript Setup
// Einbinden zweier CSS Dateien
page.includeCSS {
file1 = fileadmin/templates/css/cssdatei.css
file2 = fileadmin/templates/css/nocheinecssdatei.css
}
Das war leider erfolglos.
Wie kann ich das machen? Ich habe es auch mit Schreiben in die .less-Dateien versucht (wurde mich auch empfohlen), das klappt gar nicht so schlecht. Aber bei manchen Dateien kippt dann das Layout, obwohl ich nur ein Farbe geändert habe (z.B. in der lib.menu.miniNavbar.less).Ich weiß nicht, wo die Farbe durch die Komprimierung dann evtl. noch eingesetzt wurde. Auch kann ich keine zusätzlichen Google-Fonts einsetzen oder welche ändern. Mit (Beispiel)
page.headerData.60 = TEXT
page.headerData.60.value = <link href='http://fonts.googleapis.com/css?family=Irish+Grover' rel='stylesheet' type='text/css'>
]
bekomme ich keinerlei Reaktion. Bin jetzt etwas verzweifelt. Kann mir bitte jemand bei der Lösung des Problems helfen?
Vielen Dank schon mal!
Catarina
1. Guck dir im Firebug den Code und die CSS an und prüfe ob deine CSS drin steht und wann sie geladen wird. Eventuell wird deine CSS zuerst geladen und dann die vom Theme, somit musst du dann mit !important arbeiten.
2. Wenn du mit less arbeitest und plötzlich ist das Layout total zerhauen, wirst du einen Fehler drin haben, so dass der Parser die CSS nicht erstellen kann, dann fehlt natürlich eine Menge CSS und die Seite sieht zerschossen aus.
3. Was heißt "keinerlei Reaktion"? Siehst du die CSS von Google im Quelltext? Einbinden alleine reicht natürlich nicht, du musst in deiner CSS dann auch angeben, wo der Font verwendet werden soll, z.B. body {font-family: 'Irish Grover';}
Hallo,
Danke für deine Antwort!
Ich habe mir den Code in firebug angesehen. Meine CSS sthet nicht drin und die Google-CSS auch nicht.
Habe ich das falsch eingebunden?
Dein Typoscript ist korrekt. Guck dir dein TS mal im Template Analyzer an ob irgendwelche Fehlermeldungen vorhanden sind
Sorry, dass ich mich erst jetzt wieder melde! War zur Weiterbildung.
Habe mir mein TS im Analyzer angesehen und Fehler bei Google gefunden. Nach Änderung erscheint das jetzt im firebug, juhu!
Die CSS-Dateien fehlen allerdings immer noch.
Folgendes steht jetzt im Analyzer in meinem TS:
[GLOBAL]
page.headerData.60 = TEXT
page.headerData.60.value = <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i" rel=’stylesheet’ type='text/css'>
// TypoScript Setup
// Einbinden zweier CSS Dateien
page.includeCSS {
file1 = fileadmin/css/new-color-styles.css
file2 = fileadmin/css/new-ui-elements.css
}
Das [GLOBAL] am Anfang habe ich nicht eingesetzt, stand da so.
Findest du da etwas falsch?
Vielen Dank für deine Hilfe!
Catarina