2.2.4 Hintergrundfarben

Hintergrundfarben

Hier legen Sie die hauptsächlichen Hintergrundfarben Ihres Webshops fest. Diese Farben können von Hintergrundbildern zu 100% überlagert werden, sie bestimmen aber den Farbboden des gesamten Webshops.

Siehe beigefügte Grafik: Unterschied zwischen Untergrund, Hintergrund, Contentbereich

Beispiel

Während des Ladevorgangs des Hintergrundbildes: Die Hintergrundfarbe ist schon längst geladen und sichtbar.

Shophintergrund

Damit ist der komplette Shophintergrund der gesamten Webshop-Webseite gemeint. Siehe Grafik oben. Dieser Hintergrund wird im body-Tag in den CSS-Definitionen für den Webshop hinterlegt.

Shopuntergrund

Damit ist der Bereich direkt unter dem Shop gemeint, innerhalb des Shopaußenrahmens. Siehe Grafik oben.

Buttonleiste

Damit ist das Hintergrund der Buttonleiste gemeint.

Linker Rand

Damit ist das Hintergrundbild des linken Webshopbereiches gemeint. D.h. alle Elemente, die links unterhalb der Buttonleiste zu finden sind, angefangen von knapp über dem Warenkorb bis ganz nach unten.

Rechter Rand

Damit ist der Untergrund des Webshopbereiches innerhalb des Außenrahmens gemeint. Siehe beigefügt Grafik oben.

Contentbereich

Mit Contentbereich sind alle Funktionsboxen gemeint. Beispielsweise Artikellistenboxen, Artikeldetailansichten, die Funktionsbox Mein Warenkorb, Mein Konto etc...

Es gibt hier zwei verschiedene Bereiche, für die separat eine Hintergrundfarbe definiert werden kann:

Headline Farbe

Damit ist die Überschrift gemeint. Diese kann mit einer speziellen Hintergrundfarbe ausgestattet werden um den Überschriftenbereich vom Content einer Funktionsbox abzuheben. Zur genauen Erklärung der Headlines siehe beigefügte Grafik oben unter Menüpunkt 2.2 Darstellung & Stile > 4 Hintergrundfarben.

Content Farbe

Der eigentliche Bereich in dem die Informationen platziert werden. Unterhalb einer Headline Zur genauen Erklärung des Contentbereiches siehe beigefügte Grafik oben unter Menüpunkt 2.2 Darstellung & Stile > 4 Hintergrundfarben.

Kategoriemenü

Innerhalb des Kategoriemenüs kann für jede Verzeichnisebene eine eigene Hintergrundfarbe definiert werden. Es gibt drei verschiedene Verzeichnisebenen.

Level1 Farbe

Für diese erste Verzeichnisebene kann keine eigene Farbe definiert werden. Es wird die Farbe für den Contentbereich verwendet. Siehe oben unter Contentbereich und beigefügte Grafik oben.

Level 2 Farbe

Gilt für alle Unterebenen einer Level-1-Artikelgruppe. Alle in einer Level-1-Artikelgruppe enthaltenen Unterartikelgruppen bilden die zweite Verzeichnisebene. Es kann hier eine eigene Farbe definiert werden, um die Verzeichnisunterordnung auch farblich zu unterstreichen.

Level 3 Farbe

Gilt für alle Unterebenen einer Level-2-Artikelgruppe. Alle in einer Level-2-Artikelgruppe enthaltenen weiteren Unterartikelgruppen bilden die dritte und letzte Verzeichnisebene. Es kann hier eine weitere eigene Farbe definiert werden, um die Verzeichnisunterordnung auch farblich zu unterstreichen.

Preisschild

Für das Preisschild in Artikellistenboxen kann eine eigene Hintergrundfarbe definiert werden, um das Preisschild vom Hintergrund des Contentbereiches der Artikellistenbox hervorzuheben.

Formulare

Für alle Texteingabefelder und Dropdown-Auswahlboxen kann eine eigene Hintergrundfarbe definiert werden. Achten Sie hier auch darauf ,dass Sie eine Farbe wählen, die ein ideales Kontrastverhältnis zur Textfarbe für Formulare hat. Siehe oben unter Menüpunkt 2.2 Darstellung & Stile > 2 Texte > Formulare.

Bestellvorschauseite Pflichtinformationen

Diese Farbeinstellungen betreffen nur den Bereich des Warenkorbinhaltes auf der Bestellvorschauseite im Checkout-Prozess (Bestellweg).

Hintergrund Farbe

Hierbei handelt es sich um die Hintergrundfarbe unterhalb der Tabelle mit den Warenkorbinhalten (Tabelle mit den Pflichtinformationen)

Content Farbe

Hierbei handelt es sich um den Bereich innerhalb der Tabelle mit den Warenkorbinhalten.

Hinweis

Die hier gemachten Einstellungen werden geschrieben in die CSS-Klasse div.orderpreview-zone1, die im Rahmen des Hotfixes Buttonlösung eingeführt wurde. Wenn Ihr System in der Version V1.24-5 oder höher ist, können die CSS-Anweisungen, die im Zuge der Anpassungsarbeiten Buttonlösung im Feld Eigener CSS-Code eingegeben wurden, also wieder entfernt werden und über diese Einstellungsgruppe mit definiert werden.

Dieser Bereich kann aber auch weiterhin per CSS direkt über Eigenen CSS-Code angesprochen über die CSS-Klasse

div.orderpreview-zone1

Sollte eine rote Hinweismeldung hier angezeigt werden und diese Einstellungen im Shop nicht reagieren, prüfen Sie also bitte, ob Sie den CSS-Code eventuell im Feld Eigener CSS-Code überschreiben mit eigenen CSS-Anweisungen. Da im Zusammenhang mit der Buttonlösung der Eigenen CSS-Code direkt angepasst werden musste!