🚀 Wie man den Abstand um den Slot Picker anpasst
ℹ️ Note: Dieser Artikel wurde automatisch mit AI übersetzt und kann Ungenauigkeiten enthalten. Wenn etwas falsch aussieht, kontaktieren Sie bitte unser Support-Team.
Manchmal sitzt der slot picker etwas zu nah an den elementen um ihn herum - oder fühlt sich in seinem eigenen behälter eng. Ein paar Pixel Atemraum können es wie zu Hause auf Ihrer Warenkorbseite aussehen lassen 📐
Mit dem Abstand Einstellungen in Hoppy Delivery DatesSie können die Ränder um jeden Teil des Pickers anpassen - separat für Desktop und Mobile.
📌 Bevor Sie beginnen
- Hoppy Delivery Dates ist installiert und das App-Embed ist in Ihrem Theme aktiviert
- Der slot picker ist auf ihrer wagenseite sichtbar.
- Sie sind bei Ihrem Shopify Admin
Schritt 1 - Öffnen Sie die Erscheinungsseite
In der App-Navigation gehen Sie zu:
Hoppy Delivery Dates → Aussehen
Finden Sie die Abstand Karte.
Die Karte hat Desktop und Mobil Tabs — Abstand wird für jedes Gerät separat konfiguriert.
Schritt 2 - Verstehen Sie die vier Abstandsgruppen
Die Karte ist in vier Gruppen unterteilt, und jede kontrolliert den Rand um einen anderen Teil des Pickers:
- ABSCHNITTSPANNE → Raum um den gesamten Slot Picker-Abschnitt
- HAUPTMASCHINE → Raum um den Überschriftstext (z.B. "Wann möchten Sie diese Bestellung erhalten?")
- DATE & TIME PICKER MARGIN → Platz um die Datums- und Zeiteingabeboxen
- FEHLERMELDUNG → Platz um Fehlermeldungen (zeigt an, wenn ein Kunde keinen Slot ausgewählt hat oder unter dem Mindestbestellwert liegt)
Jede Gruppe hat die gleichen vier Felder, alle in Pixeln:
- oben
- Boden
- Links
- rechts
ℹ️ Alle Felder sind standardmäßig 10 px.
Schritt 3 - Anpassung der Margen
Geben Sie die Anzahl der gewünschten Pixel in jedem Feld ein - Sie müssen nicht "px" eingeben, es wird automatisch hinzugefügt.
Beispiel
- Der Picker berührt den Checkout-Button → erhöhen ABSCHNITTSÄTZE → Top bis
24 - Die Überschrift fühlt sich an die Datumsbox geklebt → erhöhen HAUPTMASCHINE bis
16 - Auf dem Handy strecken sich die Pickerboxen von Kante zu Kante → set DATE & TIME PICKER MARGIN → Links und rechts bis
0
💡 Nehmen Sie kleine Änderungen vor (5-10 px auf einmal), speichern und überprüfen Sie Ihre Warenkorbseite - der Abstand ist auf der Live-Seite viel einfacher zu beurteilen als in den Feldern.
Schritt 4 — Wiederholen für Mobilgeräte (optional)
Wechsel zum Mobil Tab, wenn kleinere Bildschirme unterschiedlichen Abstand benötigen. Mobile Layouts benötigen oft engere Margen als Desktops, daher lohnt sich eine schnelle Überprüfung.
Schritt 5 — Speichern und Überprüfen
Klicken Sparen Ganz oben auf der Seite.
Öffnen Sie dann die Warenkorbseite Ihres Shops und überprüfen Sie den Abstand sowohl auf dem Desktop als auch auf dem Handy 👀
⚠️ Wichtige Hinweise
⚠️ Der Desktop- und Mobile-Abstand ist unabhängig – das Ändern eines Tabs hat keinen Einfluss auf den anderen.
ℹ️ Diese Einstellungen kontrollieren nur Margen (Raum) außen jedes Element. Sie ändern nicht die Größe des Pickers selbst - dafür sehen Sie die Breite des Schlitzpflückerbehälters Einstellung abgedeckt in wie man den slot picker auf der wagenseite positioniert.
🎉 Endergebnis
Einmal erfolgreich konfiguriert:
✅ Der slot picker hat bequemen platz um ihn herum auf der wagenseite. ✅ Die Überschrift, Datums- und Zeitfelder und Fehlermeldungen fühlen sich nicht mehr eng an ✅ Desktop und Mobile erhalten jeweils einen Abstand, der ihrer Bildschirmgröße entspricht ✨
Aktualisiert am: 10/09/2026
Danke!