Unterschiedliche Produkt-Theme Vorlagen für unterschiedliche Varianten

[Leon40]

Hallo,

Ich möchte gerne innerhalb einer Produktseite mehrere Unterschiedliche Varianten anbieten. Grundsätzlich handelt es sich mehr oder weniger um das selbe Produkt, jedoch in unterschiedlicher Größe und mit unterschiedlicher Leistung.

Dementsprechend würde ich das ganze gerne so gestalten das sich die komplette Themevorlage ändert sobald der Kunde eine andere Variante auswählt. Da die Produktspezifischen Informationen auch in den Bildern und Texten der Bild mit Text Abschnitten usw. vorhanden sind, muss sich die gesamte Beschreibung beim ändern der Variante mitverändern.

Welche Möglichkeiten bieten sich mir um das Umzusetzten?

[Gabe]

Hey @Leon40 

Danke für den Sachverhalt aber da dein Vorhaben eine ziemlich komplexe Code Anpassungen verlangen wird, würde ich dir stattdessen gerne ans Herz legen, einfach die Varianten als separate Produkte mit deren eigenen Theme Vorlagen zu erstellen anstatt alles in einem Produkt reinzuprogrammieren. Eine solche Anpassung mit einem Experten: Kostenschätzung - €5k-€8k

Dazu müsstest du erwägen, ob das Ganze eine verbesserte User Experience (UX) darstellt oder ob es nicht einfach die Kunden eher verwirren könnte. Wir wissen, dass Verwirrung der größte Conversion Killer sein kann. Eins der wichtigsten UX Design Prinzipien lautet auch KISS - keep it simple silly! Dazu kommt Occam's Razor (UX principle of parsimony) - die einfachste Lösung ist die beste Lösung.

Ansonsten kannst du ja die Apps ausprobieren oder es mit Metafelder machen. Mit Metafields kannst du spezifische Informationen für jede Produktvariante speichern und diese dann in deinem Theme anzeigen lassen. Indem du die Metafields für jede Variante definierst und über JavaScript den entsprechenden Inhalt anzeigst oder verbirgst, kannst du die Produktseite dynamisch anpassen.

• Beispiel: Verwende JavaScript, um die HTML-Elemente basierend auf der ausgewählten Variante anzuzeigen oder zu verbergen​ (Shopify Community)​.

Du kannst auch die Bilder basierend auf der gewählten Variante ändern, indem du jeder Variante spezifische Bilder zuordnest und diese über JavaScript oder die Liquid-Templates anzeigst. Diese Methode kann in Kombination mit den Metafields verwendet werden, um das gesamte Layout zu ändern​ (Shopify Community)​.

Oder eben eine individuelle Anpassung des Themes durch einen Entwickler, der den Code so gestaltet, dass die Produktbeschreibung und andere Inhalte basierend auf der Variante dynamisch geändert werden. Hierbei können auch Slider oder andere interaktive Elemente eingebunden werden​ (DEV Community)​. Füge im Template die Metafields hinzu und verwende JavaScript, um die Sichtbarkeit der Inhalte zu steuern.

Apps

Variant Title King:

• Diese App ermöglicht es, den Produktnamen basierend auf der ausgewählten Variante zu ändern. Dies kann helfen, Klarheit für den Kunden zu schaffen, welche Variante er gerade ansieht​ (Shopify App Store)​. Siehe auch die Demo hier.

Variant Image Automator:

• Diese App erlaubt es, unterschiedliche Bilder für verschiedene Varianten festzulegen und diese automatisch zu wechseln, wenn der Kunde eine Variante auswählt​ (Shopify Community)​.

Variant Title Magic:

• Mit dieser App kannst du den Produkttitel automatisch basierend auf der gewählten Variante anpassen, was besonders hilfreich ist, um die Übersichtlichkeit zu erhöhen und die Kaufentscheidung des Kunden zu unterstützen​ (Shopify App Store)​. Demo hier.

Hoffe das hilft dir weiter - lass wissen falls nicht! 😉

---
Warum nicht etwas Gamification in das Shop einbauen, um deinen Kunden etwas 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.