Erstelle eine mobile Sticky Add-to-Cart-Leiste, die nach dem Hero-Bereich erscheint. Produktbild, Name, Preis, Varianten-Picker.
Want more control? See the expanded prompt ›
Füge eine Sticky Add-to-Cart-Leiste hinzu, die auf dem Handy erscheint, wenn User am Hero-Bereich vorbeiscrollen. Inklusive Produktbild, Name, Preis und Variantenauswahl.
- Mobile-only Sticky-Leiste, die sich hochschiebt, nachdem der Hero-Bereich aus dem Sichtfeld scrollt.
- Varianten-basiert: Wird bei Ausverkauf ausgeblendet und synchronisiert sich mit der Haupt-Buy-Box.
- Rund 2 KB JS, nutzt IntersectionObserver – keine Scroll-Listener.
- Kompatibel mit AJAX Cart Drawern und Standard-Warenkorb-Weiterleitungen.
Was du erreichen willst
Mobile Shopper verlieren den Add-to-Cart-Button aus den Augen, wenn sie auf der Produktseite scrollen. Bei Shops mit langen Produktseiten (Bewertungen, Zutatenlisten, FAQs) hält eine Sticky Bar den Kauf-Button in Reichweite, und Fudge vergleicht die mobile Add-to-Cart-Rate vorher und nachher.
Worauf du achten solltest
- Desktop vs. Mobile: Die Bar ist standardmäßig nur für Mobile gedacht, sodass sie dein bestehendes Desktop-Layout nicht stört.
- Hero-Kollision: Die Bar erscheint erst, nachdem der Shopper am Hero-Bereich vorbeigescrollt ist, damit der erste Eindruck sauber bleibt.
- Variantenauswahl: Die Bar berücksichtigt ausverkaufte Varianten und deaktiviert den Button entsprechend.
- Cart Drawer Kompatibilität: Die Bar funktioniert sowohl mit AJAX Cart Drawern als auch mit Standard-Warenkorb-Weiterleitungen.
Wie Fudge das macht
Fudge dupliziert dein Live-Theme in einen Entwurf, bearbeitet das entsprechende Template (Produktseite oder Warenkorb) mit den Änderungen, die dein Prompt erfordert, und testet es mit deinen echten Produktdaten. Alles beginnt im Entwurf — schau dir die Vorschau auf einem beliebigen Produkt oder im Warenkorb an, passe Details an und veröffentliche es, wenn du bereit bist. Dein Live-Shop bleibt unangetastet.
Warum Sticky Add-to-Cart-Leisten auf dem Handy funktionieren
Auf mobilen PDPs scrollt die Buy-Box schnell aus dem Sichtfeld. Eine Sticky Add-to-Cart-Leiste, die erscheint, sobald der Hero-Bereich weggescrollt wird – mit Produktbild, Name, Preis und Varianten-Auswahl – hält den Conversion-Moment immer nur einen Tap entfernt.
Wann sich die Umsetzung lohnt
Baue eine Sticky ATC für jeden Shop mit nennenswertem Mobile-Traffic und langen PDPs. Überspringe es bei kurzen PDPs, bei denen kaum gescrollt wird.
Was eine gute Leiste ausmacht
- Nur Mobile — Desktop profitiert nicht davon.
- Erscheint nach dem Hero-Bereich — durch IntersectionObserver ausgelöst.
- Bild, Name, Preis, Variante — alle kaufrelevanten Infos.
- Im Brand-Design — passt zum Rest der PDP.
Kombiniere dies mit variantenbasierter Bestandsverknappung und einer Reihe für Vertrauenssiegel und Garantien.
Fudge baut das mit seinem Store Editor; für eine Schritt-für-Schritt-Version, sieh dir den Sticky Add-to-Cart Guide an.