Hallo ich möchte gerne bei dem Screen Shot in welchem man die Zirbenwoid Schlafserie sieht keinen weißen Hintergrund bei den Produktbildern sehen. Das schaffe ich auch indem ich das Farbschema der Theme Einstellung auf grau setze aber dann habe ich gleichzeitig oben bei dem zweiten Screen Shot mit den Raumdüften einen grauen Kasten. Das möchte ich auch nicht. Kann man denn im Design das Theme Farbschema je AbschnittsKategorie ändern? Wenn ja, wie? Oder gibt es einen Workaround? DANKESCHÖÖÖÖN schon einmal vorab =)).
Topic summary
Problem: Auf der Startseite sollen Produktbilder der „Zirbenwoid Schlafserie“ keinen weißen Hintergrund haben, ohne dass gleichzeitig im Abschnitt „Raumdüfte“ ein grauer Kasten erscheint. Die globale Umstellung des Theme-Farbschemas (weiß/grau) ist dafür ungeeignet.
Frage: Lässt sich das Farbschema je Abschnitt/Kategorie separat festlegen? Falls nicht, gibt es einen Workaround?
Update/Vorschlag: Lösung per CSS statt über das globale Farbschema. Im Shopify CSS‑Editor gezielt die betroffenen Elemente ansprechen (z. B. Klasse „.card__media“) und nur dort den Hintergrund ändern, etwa auf transparent. Ein Link zur Anleitung für den CSS‑Editor wurde bereitgestellt.
Hinweis: Den CSS‑Selektor spezifisch halten, um unbeabsichtigte Effekte in anderen Bereichen zu vermeiden.
Material: Zwei Screenshots zeigen weiße vs. graue Hintergründe. Ein kurzer CSS‑Snippet wurde genannt und ist zentral für das Verständnis.
Status: Keine Bestätigung der Umsetzung durch die Threadstarterin; der Workaround ist vorgeschlagen, die Diskussion bleibt offen.
Hey Nadine! @Nadine7
Gerne helfe ich da weiter und um das zu erreichen kannst du etwas CSS verwenden. Siehe unsere Anleitung dazu hier.
Der neue CSS Editor erlaubt es dir das Look & Feel deiner Homepage und auch andere Pages zu bearbeiten in den Farben usw. wenn der Farbschema Feature etwas limitiert ist.
Um das zu erreichen, ohne das gesamte Farbschema zu ändern, könntest du den Hintergrund der spezifischen Produktbilder direkt im CSS anpassen. Hier ist ein Vorschlag, wie du das tun könntest:
-
Identifiziere die spezifische CSS-Klasse für die Produktbilder, die du transparent haben möchtest. In deinem HTML-Code sieht es so aus, als ob die Klasse
card__mediafür die Bilder verwendet wird. -
Füge spezifisches CSS hinzu, um nur den Hintergrund dieser Elemente zu ändern. Du kannst dies in den CSS-Einstellungen deiner Shopify-Seite tun. Hier ist ein Beispiel für den CSS-Code:
.card__media {
background-color: transparent !important;
}
Stelle sicher, dass andere Bereiche nicht beeinflusst werden. Da du nur den Hintergrund der Produktbilder ändern möchtest, achte darauf, dass der CSS-Selektor nicht zu breit ist und andere Elemente beeinflusst. Der oben genannte Code sollte nur auf die Bilder innerhalb der Karten angewendet werden.
Hoffe das hilft dir weiter - lass wissen falls nicht! ![]()
Warum nicht etwas Gamification in das Shop einbauen, um deinen Kunden etwas Fun im Shop anzubieten? Gerne kann ich bei Interesse Tipps dazu geben!
Hast du weitere Fragen zum Shop? Gebe einfach ein Suchbegriff oben in der Suchleiste der Community Landingpage ein, denn das Thema haben wir sehr wahrscheinlich schon besprochen. Halte bitte Ausschau in deiner E-Mail auf Notifications zu Antworten auf deine Fragen in der Community.

