Hey @FranziFDNW
So eine Operation im Code ist nicht so einfach und wir empfehlen das mit einem Experten zu machen, wenn du die oben verlinkte App nicht verwenden möchtest, die das für dich schnell lösen könnte. Und ja, du hast recht, im verlinkten Beispiel ganz oben kannst du auch sehen, dass es über die Varianten gelöst wurde; jede Variante bzw. Option mit einer Inkrementierung von 0,1m was viel Arbeit bereitet da der Stoff ja vorgeschnitten ist und nicht in willkürlichen Massen angeboten wird.
Mein Code oben ist eine Analyse wie dieser Shop es gemacht hat, was aber letztendlich nicht dasselbe ist was du erreichen möchtest. Wenn du vorgeschnittener cm oder meterware anbieten möchtest dann musst du das per unserer Anleitung unten in Inkrementierung von 0,1m oder 0,5m einrichten:
Um die Funktionalität für den Verkauf von Stoffen als Meterware in Shopify zu implementieren, kannst du den HTML-Code und das JavaScript so anpassen, dass der Kunde Stoffe in 0,5-Meter-Schritten auswählen kann und der Bestand automatisch aktualisiert wird.
Wenn du es selber auf deiner PDP programmieren möchtest dann bitte immer in einer Themekopie/Testumgebung zuerst testen und zusammen mit einem Experten/Programmierer. 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 folgende ist Theme-abhängig, ohne Gewähr und dient lediglich dazu dich in die richtige Richtung zu weisen!
Hier ist eine schrittweise Anleitung, wie du dies erreichen kannst.
HTML-Anpassung:
- Füge den angepassten HTML-Code auf der Produktseite ein. Dieser Code enthält die Mengensteuerung für den Benutzer.
−
0,5m
✓
+
Füge einen JavaScript wie folgendes Beispiel in dein Theme ein, um die “+” und “-” Schaltflächen funktional zu machen und die Menge in 0,5-Meter-Schritten zu ändern:
document.addEventListener('DOMContentLoaded', function() {
var minButton = document.getElementById('clickermin');
var plusButton = document.getElementById('clicker');
var quantityInput = document.querySelector('.foundit');
var displaySpan = document.getElementById('usersee');
var manualInput = document.querySelector('.manual-input');
minButton.addEventListener('click', function(event) {
event.preventDefault();
var currentValue = parseFloat(quantityInput.value);
if (currentValue > 0.5) {
currentValue -= 0.5;
quantityInput.value = currentValue;
displaySpan.innerText = currentValue + 'm';
manualInput.value = currentValue;
}
});
plusButton.addEventListener('click', function(event) {
event.preventDefault();
var currentValue = parseFloat(quantityInput.value);
currentValue += 0.5;
quantityInput.value = currentValue;
displaySpan.innerText = currentValue + 'm';
manualInput.value = currentValue;
});
manualInput.addEventListener('change', function() {
var currentValue = parseFloat(manualInput.value);
quantityInput.value = currentValue;
displaySpan.innerText = currentValue + 'm';
});
});
Sorge dafür, dass Shopify den Bestand entsprechend der ausgewählten Meterzahl aktualisiert. Dies erfordert möglicherweise Anpassungen an den Liquid-Templates und der Nutzung von Apps oder benutzerdefinierten Skripten, um die Bestandsführung zu automatisieren.
Erklärung:- HTML-Anpassung: Der HTML-Code definiert die Struktur für die Mengensteuerung. Zwei Schaltflächen “+” und “-” erlauben dem Benutzer, die Menge in 0,5-Meter-Schritten zu erhöhen oder zu verringern. Das versteckte Eingabefeld quantity speichert den aktuellen Wert, während das sichtbare span-Element den Wert anzeigt.
- JavaScript für die Mengensteuerung: Das JavaScript-Programm stellt sicher, dass die Schaltflächen “+” und “-” ordnungsgemäß funktionieren, indem es den Wert im versteckten Eingabefeld aktualisiert und den angezeigten Wert im
span-Element aktualisiert. Es stellt sicher, dass die Menge immer in 0,5-Meter-Schritten geändert wird.
Weitere Anpassungen und Ressourcen:- Du kannst auch Shopify Apps wie Custom Fields oder Infinite Options verwenden, um weitere Anpassungen vorzunehmen, falls nötig.
Wir verkaufen unsere Stoffe ab 0.5m und dann weiter um jeweils 0.1m
