Farben anpassen
Offnen Sie die Datei files/cts-theme/css/_scss-variables.scss in einem UTF8 fähigen Text-Editor. Dort finden Sie die SCSS-Variablen.
Ändern Sie die Angaben nach dem Doppelpunkt. Keine Variable darf entfernt oder leer gelassen werden!!
Nach dem Sie Ihre Farben eingetragen haben, müssen Sie in der Systemwartung den Skriptcache leeren.
CSS Anpassungen
Die mitgelieferten SCSS-Dateien sollten Sie nach Möglichkeit nicht ändern! Support kann dann nur noch eingeschränkt bzw. nicht mehr geleistet werden.
Wenn Sie weiteres CSS benötigen tragen Sie dies bitte in die customize-anpassungen.css ein. Sie finden diese im Ordner files/cts-theme/css.
Diese Datei ist bereits in den Seitenlayouts eingebunden.
Variablen für Text
| Erklärung | |
|---|---|
| $baseFont | Schriftfamile für Texte. Achten Sie bitte auf die beiden einfachen Anführungszeichen. |
| $baseFontSize | Schriftgröße für Texte. |
| $baseFontweight | Mögliche Angaben: normal, bold usw. Wenn Sie Webfonts einsetzen, finden Sie diese Angaben im dazugehörigen Css Code. |
| $basecolor | Schriftfarbe für Texte. |
Variablen für Überschriften
| Variable | Erklärung |
|---|---|
| $baseFontHl | Schriftfamile für Überschriften. Achten Sie bitte auf die beiden einfachen Anführungszeichen. |
| $baseFontHlweight | Mögliche Angaben: normal, bold usw. Wenn Sie Webfonts einsetzen, finden Sie diese Angaben im dazugehörigen Css Code. |
| $basecolorHl | Schriftfarbe für Überschriften |
| $FontsizeH1 | Schriftgröße für H1 |
| $FontsizeH2 | Schriftgröße für H2 |
| $FontsizeH3 | Schriftgröße für H3 |
| $FontsizeH4 | Schriftgröße für H4 |
Breite für Inhalte
| Variable | Erklärung |
|---|---|
| $container-width | Breite für den Inhaltsbereich bei FullWidth bzw. für die Boxed-Variante. |
Boxed-Variante
| Variable | Erklärung |
|---|---|
| $backgroundImage | Geben Sie hier den Pfad zum Bild an. Wenn Sie kein Bild nutzen möchten, tragen Sie folgendes ein: none |
| $backgroundAttachment | Möglichkeiten: fixed oder scroll |
| $backgroundRepeat | Kacheln der Grafik. Bei großen Bilder: no-repeat. Bei kleine Kacheln: repeat |
Akzentfarbe
| Variable | Erklärung |
|---|---|
| $accentcolor | Diese Farbe wird z.B. für die Buttons in den Image- und Colorboxen genutzt. Aber auch für den Absenden-Button im Kontaktformular. |
Topbar
| Variable | Erklärung |
|---|---|
| $topbg | Hintergrundfarbe für die s.g. Topbar. |
| $topcolor | Schriftfarbe für Inhalte in der Topbar. Sollten Sie weitere Elemente dort platzieren, muß gegebenenfalls eigenes CSS geschrieben werden. |
Logo und Navigationsbereich
| Variable | Erklärung |
|---|---|
| $headerbg | Hintergrundfarbe für den Logo und Navigationsbereich. |
Fußbereich
| Variable | Erklärung |
|---|---|
| $footerbg | Hintergrundfarbe für den Fußbereich. |
| $footerHlColor | Schriftfarbe für Überschriften im Fußbereich |
| $footerColor | Schriftfarbe für Texte und Links im Fußbereich. Sollten Sie weitere Elemente dort platzieren, muß gegebenenfalls eigenes CSS geschrieben werden. |
Hautmenü
| Variable | Erklärung |
|---|---|
| $navcolor | Schriftfarbe für Menüpunkte 1. Ebene. |
| $navcolorhover | Schriftfarbe für den Hover-Effekt und den Aktiven Zustand. 1. Ebene. |
| $navcolorbgactive | Hintergrundfarbe (1. Ebene.) für den Hover-Effekt und den Aktiven Zustand. Wenn nicht gewünscht: transparent. |
| $navradius | Nur (1. Ebene.) sichtbar wenn $navcolorbgactive genutzt wird. Standard: 0. Beispiel: 4px. |
| $navcolorLev2 | Schriftfarbe Dropdown (2. Ebene). |
| $navBgcolorLev2 | Hintergrundfarbe Dropdown (2. Ebene). |
| $navBgcolorHoverLev2 | Hintergrundfarbe (2. Ebene.) für den Hover-Effekt und den Aktiven Zustand. Wenn nicht gewünscht: transparent. |
| $navcolorhoverLev2 | Schriftfarbe für den Hover-Effekt und den Aktiven Zustand. 2. Ebene. |
Submenü - Linke/Rechte Spalte
| Variable | Erklärung |
|---|---|
| $subnavcolor | Schriftfarbe für Menüpunkte. |
| $subnavcolorhover | Schriftfarbe für den Hover-Effekt und den Aktiven Zustand. |
| $subnavbgcolor | Hintergrundfarbe für Menüpunkte. Wenn nicht benötigt: transparent |
| $subnavbgcolorActive | Hintergrundfarbe der Menüpunkte bei Hover-Effekt und aktiven Zustand. Wenn nicht benötigt: transparent |
| $subnavradius | Nur sichtbar wenn $subnavbgcolor und $subnavbgcolorActive genutzt wird. Standard: 0. Beispiel: 4px. |
| $subnavMarginBottom | Abstand unter den Menüpunkten. |
Hintergrundbilder für Artikel
| Variable | Erklärung |
|---|---|
| $articleBackgroundImage1 | Pfad zum Bild. Wenn Sie kein Bild nutzen möchten, tragen Sie folgendes ein: none |
| $articleBackgroundImage2 | Pfad zum Bild. Wenn Sie kein Bild nutzen möchten, tragen Sie folgendes ein: none |
| $articleBackgroundImage3 | Pfad zum Bild. Wenn Sie kein Bild nutzen möchten, tragen Sie folgendes ein: none |
| $articleBackgroundImage3 | Pfad zum Bild. Wenn Sie kein Bild nutzen möchten, tragen Sie folgendes ein: none |