Liquid, JavaScript, Themes
Hallo,
ich möchte in meinen Store das dort steht "Lieferung zwischen.......". Die Lieferung beträgt immer 5-7 Werktagen ab dem Tag der Bestellung. Hab momentan den liquid-code drin aber er geht immer 1-3 Tagen ab dem Tag der Bestellung. Was genau muss ich dort ändern?
Danke im Voraus
Der code sieht momentan so aus:
<p><img src="https://cdn-icons-png.flaticon.com/512/1670/1670915.png" style="height:25px;float:left;margin-right:10px;padding-bottom: 4px;"/>
Lieferung zwischen <strong><span id="fromDate"></span> - <span id="toDate"></span></strong></p>
{{ '//cdnjs.cloudflare.com/ajax/libs/datejs/1.0/date.min.js' | script_tag }}
<script>
var fromDate = Date.today().addDays(1);
if (fromDate.is().saturday() || fromDate.is().sunday()) {
fromDate = fromDate.next().monday();
}
var toDate = Date.today().addDays(3);
if (toDate.is().sunday()) {
toDate = toDate.next().monday();
}
let options = { weekday: 'long', month: 'long', day: 'numeric' };
document.getElementById('fromDate').innerHTML = fromDate.toLocaleString('de-DE',options);
document.getElementById('toDate').innerHTML = toDate.toLocaleString('de-DE',options);
</script>
Hey @Samu1987
Um den Lieferzeitraum in deinem Shopify-Store auf "5-7 Werktage ab dem Tag der Bestellung" anzupassen, musst du den JavaScript-Code, der die Berechnung des Lieferdatums handhabt, entsprechend ändern. Der aktuelle Code setzt den Beginn des Lieferzeitraums auf "1 Tag nach der Bestellung" und das Ende auf "3 Tage nach der Bestellung". Um dies auf "5-7 Werktage" zu ändern, musst du die .addDays(1)
und .addDays(3)
Methodenaufrufe anpassen. Hier ein Beispiel deines Codes etwas editiert:
<p><img src="https://cdn-icons-png.flaticon.com/512/1670/1670915.png" style="height:25px;float:left;margin-right:10px;padding-bottom: 4px;"/>
Lieferung zwischen <strong><span id="fromDate"></span> - <span id="toDate"></span></strong></p>
{{ '//cdnjs.cloudflare.com/ajax/libs/datejs/1.0/date.min.js' | script_tag }}
<script>
var fromDate = Date.today().addDays(5);
if (fromDate.is().saturday()) {
fromDate = fromDate.addDays(2); // Zum nächsten Montag verschieben, wenn Samstag
} else if (fromDate.is().sunday()) {
fromDate = fromDate.addDays(1); // Zum nächsten Montag verschieben, wenn Sonntag
}
var toDate = Date.today().addDays(7);
if (toDate.is().saturday()) {
toDate = toDate.addDays(2); // Zum nächsten Montag verschieben, wenn Samstag
} else if (toDate.is().sunday()) {
toDate = toDate.addDays(1); // Zum nächsten Montag verschieben, wenn Sonntag
}
let options = { weekday: 'long', month: 'long', day: 'numeric' };
document.getElementById('fromDate').innerHTML = fromDate.toLocaleString('de-DE', options);
document.getElementById('toDate').innerHTML = toDate.toLocaleString('de-DE', options);
</script>
In diesem Code setzen wir den Start des Lieferzeitraums (fromDate
) auf 5 Tage nach der Bestellung und das Ende des Lieferzeitraums (toDate
) auf 7 Tage nach der Bestellung. Zusätzlich prüfen wir, ob das berechnete Datum auf ein Wochenende fällt, und verschieben es entsprechend auf den nächsten Montag, um sicherzustellen, dass nur Werktage für die Berechnung des Lieferdatums berücksichtigt werden.
Darüber hinaus gibt es Shopify-Apps, die speziell dafür entwickelt wurden, die Lieferzeiten zu verwalten und anzuzeigen, was eine weitere Option sein könnte, wenn du nach einer einfacheren Lösung suchst, die möglicherweise weniger manuelle Anpassungen erfordert. Apps wie "On-Time Delivery" oder "Delivery Date Range" ermöglichen eine detailliertere Steuerung über die Anzeige von Lieferdaten und können sogar Kunden die Möglichkeit geben, Lieferdaten auszuwählen oder anzupassen.
Für die technische Umsetzung in deinem spezifischen Fall, basierend auf deinem vorhandenen Code, müsstest du, wie gesagt, die .addDays()
Methode in deinem JavaScript anpassen, um die Lieferzeit auf 5 bis 7 Tage zu setzen, anstatt 1 bis 3 Tage, wie du es derzeit hast. Berücksichtige dabei auch, dass du Logik hinzufügen musst, um Wochenenden (und möglicherweise Feiertage) auszuschließen, um genaue Lieferzeiten zu gewährleisten.
Ressourcen dazu hier:
Hoffe das hilft dir weiter - lass wissen falls nicht! 😉
---
Habt ihr auch den Shop auf Ostern eingestellt das jetzt um die Ecke liegt? Warum nicht eine Ostereierjagd 🐣 in das Shop einbauen, um deinen Kunden etwas Gamification und Fun im Shop anzubieten? Gerne kann ich bei Interesse Tipps dazu geben!
Hast du weitere Fragen zum Shop? Gebe einfach ein Suchbegriff oben in der Suchleiste der Community Landingpage ein, denn das Thema haben wir sehr wahrscheinlich schon besprochen. Halte bitte Ausschau in deiner E-Mail auf Notifications zu Antworten auf deine Fragen in der Community.
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Hallo, erstmal vielen dank. Hab den code eingefügt und es hat geklappt. Wechselt jetzt das Datum immer automatisch je nach Bestellung?
Hey @Samu1987
Super freut mich!
Ja, wenn du den aktualisierten JavaScript-Code in deinem Shopify-Store hinzugefügt hast, der die Lieferdaten auf "5-7 Werktage ab dem Tag der Bestellung" einstellt, sollte das Datum automatisch basierend auf dem Bestelldatum berechnet werden. Der JavaScript-Code nutzt die aktuelle Datums- und Zeitfunktion des Systems des Benutzers, um das heutige Datum zu ermitteln und dann entsprechend Tage hinzuzufügen, wobei Wochenenden berücksichtigt werden.
Dies bedeutet, dass für jede Bestellung, die auf deiner Webseite getätigt wird, das Lieferdatum dynamisch berechnet und angezeigt wird. Das Script überprüft das aktuelle Datum und fügt die erforderlichen Tage hinzu, um das geschätzte Lieferdatum zu berechnen, wenn die Seite geladen oder die Bestellung aufgegeben wird.
Beachte auch, dass dieser Code nicht automatisch Feiertage ausschließt, die je nach Land und Region variieren können. Wenn du möchtest, dass Feiertage berücksichtigt werden, müsstest du zusätzliche Logik in das Script einbauen, die diese Daten überprüft und entsprechend behandelt.
Hoffe das hilft dir weiter - lass wissen falls nicht! 😉
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Das werde ich hoffen haha! 😉
Am besten einfach selber ausgiebig testen! Bei weiteren Fragen kann ich gerne einen Experten empfehlen der einen näheren 👀 in deinen Theme Code wirft. Du kannst ein Backup deines Themes erstellen, bevor man den Code bearbeitet, oder den Code wiederherstellen, falls dies nötig sein sollte. Du könntest auch einen unserer Experten engagieren indem du denen eine E-Mail rüberschießt. Unsere Experten antworten meist sehr schnell.
Änderungen zu deinem Theme Code können auch 1) die Page Loading Speeds negativ beeinflussen und 2) dein Theme aus den Theme Updates ausschließen. Das obige ist Theme-abhängig, ohne Gewähr und dient lediglich dazu dich in die richtige Richtung zu weisen!
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Hi Gabe,
habe den Code als benutzerdefiniertes Liquid auf der Produktseite eingefügt. Wie kann ich dafür die Schriftfarbe und -größe ändern?
Vielen Dank
Bea
Kein Support mehr notwendig, habe es selber rausgefunden.
Teil 2 - Wie die Prinzipien des UX-Designs dir dabei helfen können einen großartigen Shop ...
By Kai Sep 16, 2024Teil 1 - Wie die Prinzipien des UX-Designs dir dabei helfen können einen großartigen Shop ...
By Kai Sep 9, 2024Anpassungen des benutzerdefinierten Codes an Shopify-Themes (CSS) leicht gemachtIn diesem...
By Gabe Aug 28, 2024