When Clicking On New Photos On Product Page The Variant In The Dropdown Menu Doesn't Change.

Technical Q&A
1

Hi,

Been using Minimal (yes, I know it’s been retired!) since we opened our store September last year.

Until the last month you could click on product photos and it would change the variant displayed in the drop down list. We modified the code following this script and everything worked fine until a month ago.

https://help.shopify.com/en/manual/online-store/themes/themes-by-shopify/vintage-themes/customizing-…

Now, it still works on the older photos/variants but NOT for the newer photos/variants we have added!

I’ve looked into the code a little and found there are some errors in the product template liquid as shown below.

Something related to lazy load I believe? Would this be affecting the photo/variant change?

Or is it something else?

Thanks

DragonBunny_0-1698478370381.png
DragonBunny_0-1698478370381.png400×194 49.4 KB

{% include 'breadcrumb' %}

{% if section.settings.product_thumbnails_position == ‘below’ or product.images.size < 2 %}

{% assign featured_image = product.selected_or_first_available_variant.featured_image | default: product.featured_image %}

{% for image in product.images %}
{% capture img_id %}ProductImage-{{ image.id }}{% endcapture %}
{% capture img_wrapper_id %}ProductImageWrapper-{{ image.id }}{% endcapture %}
{%- assign img_url = image | img_url: ‘1x1’ | replace: ‘1x1.', '{width}x.’ -%}
{% include ‘image-style’ with image: image, small_style: false, width: 700, height: 1024, wrapper_id: img_wrapper_id, img_id: img_id %}

{{ image.alt | escape }}
{% endfor %} {{ featured_image.alt | escape }}

{% if product.images.size > 1 %}

    {% for image in product.images %}
  • {{ image.alt | escape }}
    • {% endfor %}

{% endif %}

{% else %}

{% assign featured_image = product.selected_or_first_available_variant.featured_image | default: product.featured_image %}

{% for image in product.images %}
{% capture img_id %}ProductImage-{{ image.id }}{% endcapture %}
{% capture img_wrapper_id %}ProductImageWrapper-{{ image.id }}{% endcapture %}
{%- assign img_url = image | img_url: ‘1x1’ | replace: ‘1x1.', '{width}x.’ -%}
{% include ‘image-style’ with image: image, small_style: false, width: 700, height: 1024, wrapper_id: img_wrapper_id, img_id: img_id %}

{{ image.alt | escape }}
{% else %} {{ featured_image.alt | escape }} {% endfor %} {{ featured_image.alt | escape }}
    {% for image in product.images %}
  • {{ image.alt | escape }}
    • {% endfor %}

{% endif %}

2

Having the same issue. Did you figure out the issue?

3

Not yet, short term fix was to remove the old photos and replace with new of products available so that at least individual product page photos will act the same way! A stop gap fix until we have time to focus on it. Also was hoping for some feedback here but nothing forth coming yet!

4

Thank you for the reply. Does anybody else have any suggestions?

5

Having the same issue. I have a couple of old items that are set as draft due to the product being discontinued so i tried to use those products with new content and images. Still having the same issue. I don’t know anything about code or how to navigate them. Looking for someone to fix the issue. This is the one i added yesterday.

https://612moto.com/collections/all-dunlop-tires/products/dunlop-trailmax-raid

I removed all but 2 images until the issue is resolved.