FROM CACHE - de_header

shopify custom liquid reload funktioniert nicht

shopify custom liquid reload funktioniert nicht

samuelschroeder
Shopify Partner
3 0 0

Hallo, ich habe in Shopify ein Problem. Ich wollte mir mit Custom Liquid ein Extra metafield erstellen, damit ich neben den Preisen etc. auch die Größe und das Gewicht des Volumen ausgeben kann. Das hat auch alles soweit geklappt. Es gab durch location.reload aber ein Problem, ich hatte keine Möglichkeit mehr andere Varianten auszuwählen erst ist immer auf die selben Varianten zurückgesprungen. Zum Beispiel hatte ich dort die Variante Modell: in dieser gab es Viereckig und Rund. Wenn ich aber jetzt von Viereckig auf Rund wechseln wollte ist er immer nach dem reload auf Viereckig gesprungen. Hier ist der Code den ich verwendet habe. Ich würde mich freuen wenn jemand eine Lösung für das Problem hat.

{% for variant in product.variants %}
	{% if product.selected_or_first_available_variant.id == variant.id %}
		{% if variant.metafields.custom.vari_abmessung and variant.metafields.custom.vari_gewicht %}
			{{ variant.metafields.custom.vari_abmessung | metafield_tag }}
			{{ variant.metafields.custom.vari_gewicht | metafield_tag }}
			
			<script>
				var targetAbmessung = document.querySelector('.metafield-rich_text_field:nth-child(1) > p');
				var textAbmessung = document.createTextNode('Abmessung: ');
				targetAbmessung.insertBefore(textAbmessung, targetAbmessung.firstChild);
			</script>
			
			<script>
				var targetGewicht = document.querySelector('.metafield-rich_text_field:nth-child(2) > p');
				var textGewicht = document.createTextNode('Gewicht: ');
				targetGewicht.insertBefore(textGewicht, targetGewicht.firstChild);
			</script>
		{% elsif variant.metafields.custom.vari_abmessung and variant.metafields.custom.vari_gewicht == blank %}
			{{ variant.metafields.custom.vari_abmessung | metafield_tag }}
			
			<script>
				var targetAbmessung = document.querySelector('.metafield-rich_text_field:nth-child(1) > p');
				var textAbmessung = document.createTextNode('Abmessung: ');
				targetAbmessung.insertBefore(textAbmessung, targetAbmessung.firstChild);
			</script>
		{% elsif variant.metafields.custom.vari_abmessung == blank and variant.metafields.custom.vari_gewicht %}
			{{ variant.metafields.custom.vari_gewicht | metafield_tag }}
			
			<script>
				var targetGewicht = document.querySelector('.metafield-rich_text_field:nth-child(1) > p');
				var textGewicht = document.createTextNode('Gewicht: ');
				targetGewicht.insertBefore(textGewicht, targetGewicht.firstChild);
			</script>
		{% endif %}
		
		{% if variant.metafields.custom.vari_abmessung or variant.metafields.custom.vari_gewicht %}
			<script>
				var optBtns = document.querySelectorAll('.option-selector__btns .opt-btn');
				
				optBtns.forEach(function(optBtn) {
					optBtn.addEventListener('click', function() {
						setTimeout(function(){
							location.reload();
						}, 100);
					});
				});
			</script>
		{% endif %}
	{% endif %}
{% endfor %}
2 ANTWORTEN 2
samuelschroeder
Shopify Partner
3 0 0

yes the process works the problem is the reload. This does when you select the new variant jump back to the old variant. I would like the variant to be updated by the reload so that I can also choose a different variant. Thats my Problem the rest of the code works good. Thanks 

samuelschroeder
Shopify Partner
3 0 0

Das Problem ist der Code funktioniert. Aber wenn ich eine andere Variante bei dem Produkt wählen möchte, reloaded er die ganze Seite und nicht das Custom Liquid. Das heisst wenn ich eine andere Variante wähle zum Beispiel von Rund auf Viereckig, springt er beim reload wieder auf die Variante Rund. Wenn ich im Code den reload raus nehme, kann ich von Variante zu Variante switchen ohne Probleme (aber die Variantenfelder aktualisieren sich logischerweise nicht) . Hat irgendwer eventuell eine Ahnung wie ich das umgehen kann damit beim auswählen der neuen Variante beim reload ebenfalls die Variante aktualisiert wird?