WAY to many Pictures and no way to manage them!

Highlighted
New Member
6 0 0

I have 25 variants, and 30+ pictures. The problem is that the pictures do not tile, and there is no way to hide them:

https://cedarmillfirearms.com/products/nanuk-909-case-for?variant=5760075825181

This makes a list a mile long of thumbnails, and I would like to either hide the majority of them, Tile them to the left or other solutions. I run the Minimal theme

 

0 Likes
Shopify Expert
2615 50 614

HI AJ,

You may want to hide the thumbnails which are assigned as variant images. They will still be shown if this particular variant is selected, but the number of thumbnails will be greatly reduced to show only images which are not variant-specific. 

I recommend making a backup of your theme by clicking Actions->Duplicate prior to editing it.

Now, open the product-template.iquid Section, and find this code starting at line ~70:

<ul class="product-single__thumbnails grid-uniform" id="ProductThumbs">
  {% for image in product.images %}
    <li class="grid__item wide--one-quarter large--one-third medium-down--one-third">
      <a data-image-id="{{ image.id }}" href="{{ image.src | img_url: '1024x1024' }}" class="product-single__thumbnail">
        <img src="{{ image.src | img_url: 'grande' }}" alt="{{ image.alt | escape }}">
      </a>
    </li>
  {% endfor %}
</ul>

and replace it with this:

<ul class="product-single__thumbnails grid-uniform" id="ProductThumbs">
  {% for image in product.images %}
    {% unless image.attached_to_variant? %}
      <li class="grid__item wide--one-quarter large--one-third medium-down--one-third">
        <a data-image-id="{{ image.id }}" href="{{ image.src | img_url: '1024x1024' }}" class="product-single__thumbnail">
          <img src="{{ image.src | img_url: 'grande' }}" alt="{{ image.alt | escape }}">
        </a>
      </li>
    {% endunless %}  
  {% endfor %}
</ul>

(basically, two lines are added -- {% unless ... %} and {% endunless %} )

 

Want to hire me to tweak a theme? Mail me at tairli@yahoo.com!
My post solved your problem? Like it!
1 Like
New Member
6 0 0

I just add

    {% unless image.attached_to_variant? %}

and

    {% endunless %}  

 

Thank You!! That is perfect!

0 Likes