Farbanpassung Checkout

Hallo zusammen,

ich würde im checkout/confirm gerne oben bei den Steps und zwischen Hauptframe un Footer die Farben ändern.
Kann mir da jemand helfen?

Da wirst du mit großer Warscheinlichkeit eigenen CSS-Code einbinden müssen, die betroffenen Klassen kannst du dir anschauen indem du auf der betroffenen Seite auf F12 drückst, in den meisten, gängigen Browsern öffnet das ein Code- und CSS- Untersuchungstool und du kannst dir ansschauen, welche CSS-Klassen du bearbeiten müsstest.

Bei Firefox z.B. kannst du auch in diesem Fenster herumprobieren und direkt schauen, welchen Effekt der geänderte CSS-Code auf die Seite haben wird ohne stets Skripte ändern und den Cache über das Backend löschen zu müssen.

 

1 „Gefällt mir“

@FischtechAT schrieb:

Hallo zusammen,

ich würde im checkout/confirm gerne oben bei den Steps und zwischen Hauptframe un Footer die Farben ändern.
Kann mir da jemand helfen?

Was meinst Du genau? Den Hintergund? Wenn ja, dann:

body.is--ctl-checkout.is--act-confirm.is--user.is--minimal-header {
    background-color: #YOUR-HEX-COLOR;
}

 

1 „Gefällt mir“

Genau, den Hintergrund.
Ich hab aber keine Ahnung in welchem File das Codesnippet einzufügen ist.

Sollte unter „/themes/Frontend/[DeinThemeName]/frontend/_public/src/less“ eine „all.less“ - Datei geben.

Entweder du packst es da ganz ans Ende oder bindest eine neue Datei ein, das wäre vermutlich sauberer.

In dem Fall kommt in die Less nur folgendes:

@import 'DeinStyle';

und in das selbe Verzeichnis legst du dann eine neue Datei „DeinStyle.less“ mit dem CSS-Code drin.

 

Besten Dank, ich habe beide Varianten versucht. Dannach die Caches gelöscht und das Theme kompiliert.
Allerdings sehe ich im Frontend keine Veränderung. Kann es eventuell an dem hintelegten Hintergrundbild liegen?
Das habe ich im Thememanager unter Farben mittels Pfad eingefügt.

Gut möglich, in dem Fall müsstest du noch folgendes in deiner CSS angeben:

background-image:none;

Ich versteh das nicht. Wenn ich im Thememanager das BG Bild entferne und hier eine Farbe definiere ändert sich das auf den gesamten Hintergrund. Soweit is mir das auch klar.
Wenn ich dort allerdings auch den HEX Code lösche und über die “DeinStyle.less” eine Farbe definiere mit z.B.

body.is--ctl-checkout.is--act-confirm.is--user.is--minimal-header {
    background-color: #ff6600;
}

ändert sich nichts. Als würd ich die falsche .less editieren.

Hast du die DeinStyle.less richtig in der all.less eingebunden?

Gegebenenfalls stimmt die Klassenbezeichnung einfach nicht, wie gesagt, das schaust du am Besten bei dir selbst auf der Seite mit F12 nach.

Manchmal hilft bei Änderungen auch nur, den productions-Ordner unter „/var/cache“ zu löschen, bevor diese angezeigt werden…

1 „Gefällt mir“

Besten Dank für deine Hilfe, aber nach 2 tägiger Fehlersuche habe ich mich nun für ein anderes Theme entschieden. Das werd ich nach meinen Vorstellungen umbauen.

Zu deinen Tips: ich habe all die Anweisungen bei einem anderem Theme befolgt und es hat auch geklappt. Nur eben nicht bei dem von mir verwendeten. Weiß der Geier was ich da schon wieder aufgeführt hab :wink:
 

Danke nochmal!

Sollte jemand einen guten Vorschlag für ein responsiv Theme haben, welches mich nicht in den finanziellen Ruin treibt, bin ich für Vorschläge gerne offen! :slight_smile: