Konvertierung
Die Entscheidung ist gefallen. Und der Kaufbutton befindet sich zwei Bildschirme weiter oben.
Der Kunde scrollt nach unten, um die Beschreibung zu lesen, die Bewertungen zu prüfen und die Größen zu vergleichen. Bis er sich zum Kauf entscheidet, muss er wieder nach oben scrollen. Die schwebende „In den Warenkorb“-Leiste platziert sie genau im Moment seiner Entscheidung vor seinen Augen.
0 Zeilen
Vorlage zum Anfassen: Sie installiert sich und funktioniert mit dem bereits vorhandenen Theme.
8.x → 9.x
Reines JavaScript, ohne jQuery: Funktioniert in Classic und Hummingbird gleichermaßen gut.
1 Bildschirm
Konfiguration ohne Registerkarten oder Assistenten
Es erscheint nur bei Bedarf.
Der Kaufbutton ist zwar sichtbar, die Leiste fehlt jedoch, da sie das Produkt unnötig verdecken würde. Sobald sie den Bildschirm verlässt, erscheint sie unten – oder oben, je nach Auswahl – wieder mit Produktfoto, Name, gewählter Variante, Preis und einem eigenen Button.
Es überwacht kein Scrollen, wodurch die ruckartigen Ladezeiten der Seite vermieden werden. Stattdessen nutzt es IntersectionObserver : Der Browser benachrichtigt Sie, sobald der Button nicht mehr sichtbar ist. Praktisch keine Kosten und keine Layoutbeeinträchtigungen .
/ Folgen Sie der Kombination, die der Kunde betrachtet
Genau das ist der Fehler, der bei fast allen schwebenden Symbolleisten auftritt. Wenn man eine Größe oder Farbe auswählt, aktualisiert PrestaShop nicht den Warenkorb-Block, sondern ersetzt ihn komplett. Eine Symbolleiste, die den alten Button beibehält, kann ab diesem Zeitpunkt keine Artikel mehr in den Warenkorb legen, und niemand merkt es, bis Bestellungen verloren gehen.
Preis
Es wird mit dem Wert für die gewählte Kombination aktualisiert, einschließlich des durchgestrichenen Preises, falls es sich um einen Sonderpreis handelt.
Variante
Die Bezeichnung Ihrer Auswahl unterhalb des Produkts: „Pink“, „M · White“.
Bild
Das Foto ändert sich je nach Kombination, genau wie auf der Karte.
Aktie
Wenn das ursprüngliche Gerät aufgrund von Warenmangel den Betrieb einstellt, stellt das Gerät an der Bar ebenfalls den Betrieb ein.
/ Kauf über die Schaltfläche aus Ihrer eigenen Vorlage
Die Leiste fügt Artikel nicht automatisch dem Warenkorb hinzu; sie leitet den Klick an die bereits vorhandene Schaltfläche weiter. Dadurch bleiben die ausgewählte Menge, die Lagerbestandsverwaltung, die Designbenachrichtigung und alle weiteren Einstellungen dieser Schaltfläche erhalten. Selbst wenn Sie morgen das Design ändern, funktioniert die Leiste weiterhin.
Und es passt sich Ihrem Shop an, ohne dass Sie eine einzige Zeile Code verändern müssen.
Farben
Hintergrund, Text, Preis und Schaltfläche, jeweils mit eigenem Auswahlfeld.
Form
Eckradius, von der Pille zur Karte und maximale Breite bzw. volle Breite.
Symbol
Entweder die mitgelieferte Datei, eine eigene im SVG-Format oder ein von Ihnen hochgeladenes Bild. Oder keines von beiden.
Schicht
Wenn Sie einen Support-Chat oder einen Cookie-Hinweis haben, erhöhen Sie den Z-Index und hören Sie auf, darauf zu treten.
Wurde das Theme stark verändert? Die Auswahl des Kaufbuttons ist nur eine weitere Einstellung: Sie wurde in der Konfiguration geändert, ohne dass eine Datei bearbeitet wurde.
Auf Mobilgeräten, wo es am deutlichsten auffällt.
Auf einem Smartphone-Bildschirm verschwindet der Kaufbutton beim ersten Wischen. Die Leiste verkleinert sich automatisch: Foto, Preis und Button bleiben erhalten, der Text wird nur auf größeren Bildschirmen angezeigt.
Kompatibel mit PrestaShop 8.x und 9.x · Klassische und Hummingbird-Themes
Entwickelt und betreut von REKIRE
