Aktualisierung der Produktseite bei Variantenauswahl

Hallo zusammen,

kann mir einer sagen, ob das auch bei dem Craft Theme funktioniert?

Community Beitrag: Need a page refresh everytime a variant changes

Nach Anlegen einer Sicherheitskopie habe ich den Code in die customer.js unter Assets eingefügt, aber es hatte nicht den gewünschten Effekt. Vielleicht habe ich auch etwas falsch verstanden.

Würde mich freuen, wenn mir jemand weiterhelfen kann.

Vielen Dank & liebe Grüße

Daniela

Hi Bambusbasis,

da ich selber kein Programmierer bin, kann ich dir nicht sagen, ob der von dir genannte Code auch in Craft funktioniert.

Dafür kann ich dich jedoch an unsere Designtime verweisen mit der man bestimmte Anpassungen von unseren Themedesignern vornehmen lassen kann.

Mit jedem bezahlten Shopify Plan bekommt man 60 Minuten Designtime, bei der Verwendung eines unserer Shopify Themes, was in deinem Shop mit Craft der Fall ist.

Um dieses ANgebot in Anspruch nehmen zu können, würdest du uns eine E-Mail schreiben mit:

  • Einer kurzen Erläuterung der Problematik / Designanfrage und warum du die Änderung vornehmen möchtest.

  • Screenshots / Bildschirmaufnahmen des Problems / der Designanfrage.

  • Links zu den betroffenen Seiten im Shop.

Meine Kollegen würden dir daraufhin in 24-48 Stunden antworten und deine Anfrage an unsere Themedesigner weiterleiten, um abzuklären, ob die Änderungen so vorgenommen werden können, bevor diese dann mit der Arbeit anfangen, was in etwa 24-72 Stunden passiert.

Was hältst du von diesem Vorschlag?

Da du dich gerade mit dem Design deines Shopify Shops beschäftigst, dachte ich kannst du bestimmt auch von diesen Tips zum Thema profitieren.

Hallo @Kai ,

danke für Deine Rückmeldung. Grundsätzlich würde ich sagen, dass das ein super Vorschlag ist. Allerdings hatte ich schon Kontakt zum Support und habe einige Änderungswünsche dafür zusammengefasst. Diese wurden überprüft, ob sie durch die 60 Minuten Design Time umgesetzt werden können…das Ergebnis war leider sehr enttäuschend. Denn nichts davon fällt in die Design Time. Vom Support wurde mir mitgeteilt, dass es eine Liste gibt, wo man nachlesen kann, welche Anpassungen von den Theme-Entwicklern übernommen werden.

Das hier waren übrigens die angefragten Änderungswünsche:

1. Reload der Produktseite bei Variantenauswahl
Sobald eine andere Variante ausgewählt wird soll die Produktseite neu geladen werden, damit sich die eingebetteten Varianten-Metafelder aktualisieren.

2. Zoom-Icon der Produktbilder verschieben
Momentan wird der Zoom-Button von den Produktbildern beim Mouseover auf der oberen linken Seite angezeigt. Wir hätten ihn gerne auf der oberen rechten Seite.

3. Social Media Buttons
Wir würden die Social Media Buttons gerne präsenter im Header platzieren, statt unten ganz klein in der Fußzeile.

Naja…und dementsprechend versuche ich jetzt natürlich wieder hier in der Community Hilfe zu finden.

Liebe Grüße
Daniela

Hi Bambusbasis,

das stimmt, der Aufgabenbereich unserer Themedesigner ist limitiert, dennoch sah ich eine Chance, dass die Refresh-Option eventuell doch von ihnen umgesetzt werden könnte, aufgrund des Nutzwertes für den Kunden, die eine solche Funktionalität mit sich bringen würde.

Solltest du hier im Forum keine Lösung finden kann ich dir die Shopify Experten empfehlen, die du für solche Anpassungen einstellen kannst.

Die Shopify Expert Seite kann auf zwei Arten genutzt werden. Entweder veröffentlichst du dort einen Job und erhältst darauf Kostenvoranschläge oder du suchst per Kriterien nach einem Experten und betest so um einen Kostenvoranschlag:

Hast du die Seite bereits genutzt?

Hi Kai,

auf der Seite war ich schon und habe auch mit einem Experten gesprochen, aber meinen Chef muss ich halt auch immer irgendwie überzeugen :grinning_face_with_smiling_eyes:

Ich finde schon noch eine Lösung. Trotzdem Danke!

Liebe Grüße
Daniela

Alles klar, das ist verständlich Bambusbasis. Vielleicht kann hier ja auch Finer weiterhelfen? Er ist gut mit Code-Angelegenheiten.

Finer war quasi der Shopify-Experte mit dem ich auch über andere Sachen gesprochen habe :slightly_smiling_face:

Wie gesagt, trotzdem danke für die Hilfe!

1 Like

Hi @Bambusbasis

Hast du das lösen können?

Hallo @Gabe ,

nein, leider noch nicht richtig. Ich habe zwar etwas eingebaut, wodurch die Seite neu läd. Allerdings bei jedem Klick und nicht nur bei der Variantenauswahl, was ein paar Probleme mit sich bringt.

Liebe Grüße
Daniela

Ah verstehe Daniela! Ich sehe der Shopify Partner bietet dir gerade Hilfestellung im anderen Leitfaden mit diesem Code.

Dieser Partner ist sehr gut und kann das für euch sicherlich einbauen wenn ihr ihn in Auftrag nimmt!

Hoffe das hilft!

Falls noch jemand versucht die Funktionserweiterung, eine Seitenaktualisierung hervorzurufen, wenn sich eine Variante ändert umzusetzen, könnt ihr diesen Thread anschauen.

Hallo @Gabe und @Kai ,

vielen Dank für Eure Unterstützung!

Liebe Grüße

Daniela

Hey @Kai

Das ist der Thread wo Daniela schon mit Guleria in Kontakt ist. Das Problem kann da sein, dass dieser Code womöglich nur in den alten Vintage Themes funktioniert und nicht für das Craft 2.0 Theme gedacht ist. In deinem Craft Theme kannst du jetzt auch benutzerdefinierten CSS direkt im Theme Editor einbauen was dir helfen kann eigenen Code Lösungen einzubauen ohne das Theme Code zu zerschiessen. Ein super Protektionsmechanismus!

Um die Seite automatisch bzw. dynamisch zu laden, wenn eine bestimmte benutzerdefinierte Variantenauswahl getroffen wird braucht man ein Auswahlfeld oder Optionsfeld, um die Varianten auszuwählen, und die genaue Form Methode die dafür verwendet wird, sprich, den Klassennamen des Auswahlfelds oder des Optionsfelds identifizieren und den Code entsprechend anpassen. Der Klassennamen des Auswahlfelds oder des Optionsfelds ist normalerweise etwas wie ein single-option-selector.

In diesem Fall sollte man einen Code ähnlich wie den folgenden in die theme.liquid-Datei einfügen, bevor das schließende </body>-Tag:


Stelle auch sicher, dass jQuery auf der Seite geladen wird, bevor man diesen Code einfügt. Wenn du dir nicht sicher bist, ob jQuery bereits auf der Seite geladen ist, kannst du die folgende Zeile vor dem oben genannten Code einfügen:


Wenn du es selber auf deiner Produktseite programmieren möchtest dann bitte immer in einer Themekopie/Testumgebung zuerst testen und zusammen mit einem Experten/Programmierer.

Änderungen zu deinem Theme Code können auch 1) die Page Loading Speeds negative 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!

Hallo @Gabe ,

danke für Deine ausführliche Erklärung und Deinem Hinweis zu den css-Dateien.

Ich tue mich etwas schwer damit die richtige Klasse und die Form-Methode zu identifizieren. Das hier habe ich bisher im Code gefunden:

Hilft mir das weiter? Oder bin ich da auf dem Holzweg?

Liebe Grüße

Daniela

Danke für die Warnungen @Gabe . Das weiß ich zu schätzen und ich bin mir dessen auch bewusst. Aber aus der aktuellen Perspektive, kann, denke ich, nicht mehr viel Schlimmes passieren. Die Seite läd gerade bei jedem Klick wegen einem falschen Script neu, von den Updates ist das Theme bereits ausgeschlossen, da der Support einer App was am Code verändert hat und ich mache jedes Mal eine Theme Kopie bevor ich etwas ändere, sodass ich zu dem vorherigen Stand zurückkehren kann. Aber ich lasse mich gerne eines Besseren belehren, wenn ich das falsch einschätze.

Jetzt habe ich jedenfalls die Optionsfelder gefunden. Das andere war ja auch nur ein Script, was in bestimmten Fällen ausgeführt wird.

Wenn ich das dann richtig verstanden habe, ist die Klasse product-form_input und die Art der Eingabefelder, also type=“radio” , wichtig. Sowie der Feldname…bei Dir im Code [name=“id”] …das verstehe ich allerdings nicht.

Falls mir jemand noch damit weiterhilft, freue ich mich und wenn nicht, bin ich trotzdem froh, um die bisherige Hilfe.

Liebe Gruße

Daniela

1 Like

Hallo zusammen,

mittlerweile habe ich mein Problem gelöst und möchte dies hier auch für alle anderen veröffentlichen, die eventuell dasselbe umsetzen möchten.

Legt vorher immer eine Theme-Kopie an, falls die Bearbeitung Eures Codes doch Probleme verursachen sollte.

Also wir nutzen das Craft Theme Version 8.0.0 - das ist relevant, da der Programmiercode bei älteren Versionen noch anders aufgebaut war.

Ich habe beim unter Snippets > product-variant-options.liquid eine Klasse vergeben. Siehe Zeile 52 class=“refresh-button”.

Danach habe ich unter Abschnitte > main-product.liquid folgenden Code hinzugefügt:

Immer, wenn nun auf einer Produktseite die Variante gewechselt wird, wird die Seite neu geladen.

Danke für Eure Unterstützung auf dem Weg zur Lösunge! @Gabe @Kai

Liebe Grüße
Daniela

1 Like