ThemeWare / Trusted Shops Widget: Mobile Ansicht nach links verschieben (CSS)


Hallo zusammen,

ich nutze Shopware 6 in der Version 6.6.x in Verbindung mit dem ThemeWare-Theme und habe ein Darstellungsproblem mit dem Trusted Shops (eTrusted) Widget in einer Erlebniswelt.

Ausgangslage:
In der Desktop-Ansicht wird das Widget korrekt dargestellt.
In der mobilen Hochformat-Ansicht reicht der Platz jedoch nicht aus, um neben den Sternen auch die Anzahl der Bewertungen, zum Beispiel „1.032 Bewertungen“, vollständig anzuzeigen.

Ziel:
Ich möchte keine inhaltliche oder strukturelle Änderung vornehmen, sondern lediglich das bestehende Widget in der mobilen Ansicht minimal nach links verschieben, sodass die Bewertungsanzahl sichtbar bleibt.
Die Desktop-Darstellung soll dabei unverändert bleiben.

Problem:
In ThemeWare finde ich kein eindeutiges Feld für Custom CSS beziehungsweise eigenes CSS, um eine kleine Media Query, zum Beispiel für max-width 480px, zu hinterlegen.
In den CMS- beziehungsweise Erlebniswelt-Einstellungen scheint es dafür ebenfalls keine geeignete Stelle zu geben.

Fragen:
Wo ist in ThemeWare vorgesehen, eigenes CSS sauber und updatesicher zu hinterlegen?
Gibt es eine ThemeWare-spezifische Lösung, um einzelne CMS-Elemente wie das Trusted Shops Widget nur in der mobilen Ansicht minimal zu verschieben?
Oder ist dies ausschließlich über ein Child-Theme umsetzbar?

Vielen Dank vorab für Hinweise oder Best Practices.

Viele Grüße
Rolf

CSS-Selektoren funktionieren unabhängig deines Themes überall gleich. Du musst dir diese eben einfach raussuchen. Wenn das Element selbst keine eindeutige class hat, dann musst du eben auf das übergeordnete Element und dann über :first-child oder andere Selektoren das Element steuern.

Moin,

das Trusted-Shops Widget wird per Javascript als #shadow-root (closed) eingebunden. Da wird dir verrmutlich eigenes css/js nicht sehr viel helfen. Du könntest versuchen das Element selber nach links zu schieben, so dass es theoretisch zu weit links sitzen würde. Bei Trusted Shops selber kann man das Widget in diesem Maße meines Wissens nach auch nicht bearbeiten.

Grüße
Matthias

2 „Gefällt mir“

Wieder etwas gelernt :grinning_face_with_smiling_eyes: Danke.

1 „Gefällt mir“

Hallo Matthais,
vielen Dank für deine schnelle Hilfe.
Ich werde mal Trusted Shop anschreiben.
Viele Grüße
Rolf

1 „Gefällt mir“