Hi Franz! @franz-messner
Danke für die Angaben und beim verbergen der “Thumbnails” oder über den Selektoren die Produktvarianten ausblenden, müssen einige komplexe Code Skripte laufen die über verschiedene liquid Dateien agieren und auch im CSS sieht es ziemlich kompliziert aus.
Vielleicht können diese zwei Developer Anleitungen etwas Licht auf die ganze “Mechanik” werfen, wie z. B. Nr. 5 & 6:
- Find a variant ID
- Get customers to choose an option
- Hide sold-out variants
- Localize your product prices for search engines
- Show featured image until a variant is selected
- Select variants by clicking their images
- Use products with multiple options
- Add pickup availability to product pages
Hier wäre z. B. interessant zu wissen, ob du ein Shopify Theme oder ein drittanbieter Theme aus unserem Theme Store verwendest, und somit lass uns mal hier weiter nach Lösungen suchen. Die 60-Min Shopify Design Time sind derzeit für unsere Free Themes erhältlich und nicht vergessen, wenn du deine Shop URL hier postest kann ich gerne mal ein Blick reinwerfen und Tipps abgeben.
Mit dem Design Time kann unser Team z. B. so was wie den folgenden Checkbox zum Theme Editor für die Product Page hinzufügen:
Wie oben dargestellt kann man im Produktseiten-Abschnitt des Editors so ein Feature einbauen. Das kann auch ein Experte für dich gerne machen. Ein typischer Code hier wäre etwas wie:
Show More
{% comment %}
Get first variant in stock, or deep linked one
{% endcomment %}
{% assign current_variant = product.selected_or_first_available_variant %}
{%- assign featured_image = current_variant.featured_image | default: product.featured_image -%}
{% for image in product.images %}
{% capture img_id %}ProductImage-{{ image.id }}{% endcapture %}
{% capture wrapper_id %}ProductImageWrapper-{{ image.id }}{% endcapture %}
{%- assign img_url = image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}
{% include 'image-style' with image: image, width: 720, height: 600, small_style: true, wrapper_id: wrapper_id, img_id: img_id %}
{% if product.compare_at_price_max > product.price %}
{{ 'products.product.on_sale' | t }}
{% endif %}
{% endfor %}
Dann ist hier die IF Statement die verwendet werden kann:
Show More
{% if product.images.size > 1 and section.settings.show_thumbnails %}
{% case product.images.size %}
{% when 2 %}
{% assign thumbnail_width = 'small--one-half medium-up--push-one-sixth medium-up--one-third' %}
{% when 4 %}
{% assign thumbnail_width = 'small--one-half medium-up--one-quarter' %}
{% else %}
{% assign thumbnail_width = 'small--one-third medium-up--one-third' %}
{% endcase %}
{% for image in product.images %}
-
{% endfor %}
Als zusätzliche Anmerkung: Das primäre Bild wird immer noch auf das relevante Bild aktualisiert, wenn eine Variante aus dem Dropdown ausgewählt wird!
Dann habe ich eine App gefunden (für ca. €6/Monat) die u. a. da folgende ermöglicht und sehr gute Bewertungen bekommt:
Wäre das ein Ansatz? Dann habe ich ein paar Code-Beispiele gefunden die vielleicht etwas getweakt werden sollten für dein drittanbieter Theme. Der Folgende Code im theme.scss kann die Varianten Bilder verstecken:
.product-single__thumbnails { display: none;}
Dann kann man die Variable image.attached_to_variant verwenden. Das Code kann man im product-template.liquid ggf. finden und dann die Bedingung in der Variantenschleife prüfen.
{% unless image.attached_to_variant? %}
//your thumb image code goes here
{% endunless %}
Suche einfach nach{% for image in product.images %}
