Skip to main content

Überblick

Der Sticky-Cart-Button von Upcart kann mit benutzerdefiniertem CSS in Größe und Position angepasst werden. So kannst du ihn besser an das Branding deines Stores oder deine Vorlieben für das Nutzererlebnis auf Desktop- und Mobilgeräten anpassen. Je nachdem, wie viel Kontrolle du möchtest, stehen zwei Ansätze zur Verfügung.

Option 1: Skalierte Größenänderung (einfache Einrichtung)

Diese Methode verwendet einen einzigen Skalierungsfaktor, um den Button und das Symbol proportional zu verkleinern oder zu vergrößern. Es ist die einfachste Möglichkeit, die Button-Größe mit minimalem Code anzupassen.

Wo du das einfügst

Gehe zu Upcart > Sticky Cart > Custom CSS und füge den folgenden Code ein.

So passt du es an

  • Ändere transform, um die Größe des Buttons anzupassen (z. B. 0.8, 0.6, 1.25 usw.)

Option 2: Pixelgenaue Größenänderung (erweiterte Kontrolle)

Mit dieser Methode kannst du die Abmessungen jedes Elements einzeln mit px-Werten steuern. Verwende sie, wenn du präzise Anpassungen möchtest, die nicht auf Skalierung basieren.

So passt du es an

  • Passe die Variablen in :root an, um die Größe jedes Elements zu vergrößern oder zu verkleinern
  • Justiere die left- und top-Werte innerhalb der Selektoren, um das Symbol und das Badge visuell zu zentrieren

Brauchst du Hilfe?

Wenn du dir nicht sicher bist, welche Methode für dich die richtige ist, oder Hilfe beim Schreiben von benutzerdefiniertem CSS benötigst, empfehlen wir dir, dich an einen Shopify-Experten zu wenden. Der Upcart-Support unterstützt nicht direkt bei der CSS-Implementierung. Shopify-Experten ansehen