Re: Make a specific image disappear in the images array

Make a specific image disappear in the images array

Auplant
Visitor
2 0 0

Just for testing purposes, I'm trying to figure out how to make one of the product images disappear through code, in this case the last product image

 

I tried adding this code in product-grid-item.liquid, although it doesn't work, and I'm wondering how I could change the code to get this working.

 

{% if product.images == product.images.last%}
{% assign image = null %}
{% endif %}

 

Replies 3 (3)

oscprofessional
Shopify Partner
16215 2425 3149

@Auplant wrote:

Just for testing purposes, I'm trying to figure out how to make one of the product images disappear through code, in this case the last product image

 

I tried adding this code in product-grid-item.liquid, although it doesn't work, and I'm wondering how I could change the code to get this working.

 

{% if product.images == product.images.last%}
{% assign image = null %}
{% endif %}

 



Hello 

 

You can use css to hide the last image 

li:nth-last-child(n) {
  property: value;
  property: value;
  ...
}

 Instead of your class name instead of "li"

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing | Oscp Upsell & Cross sell App : Free | Oscp Sales & Volume Discount App : Free | Custom Pricing Wholesale App : Free | OSCP Shipping Discounts App : Free
Auplant
Visitor
2 0 0

Ok cool, I guess css is the most practical way to do this, although I was trying to fix an error with the product image hover. It works fine when the product has 3 images, but the last product image overlaps the first product image in the case when the product has only two images.

Perhaps it is better to adjust the reveal code in css.

PaulNewton
Shopify Partner
7536 666 1595

{% if product.images == product.images.last%}
{% assign image = null %}
{% endif %}

 

That is trying to match an object array to an element in the array so the condition will never be met.

 

You can try inside the forloop that is outputting images testing if that's the last iteration of the forloop then setting null or {% break %} the loop.

{% for image in product.images %}
....

{% if forloop.index.last %}
{% assign image = null %}
{% endif %}

....
{% endfor %}

Or comparing to product.images.last 

 

{% for image in product.images %}
....

{% if image == product.images.last%}
{% assign image = null %}
{% endif %}

....
{% endfor %}

 

 

 

Contact paull.newton+shopifyforum@gmail.com for the solutions you need


Save time & money ,Ask Questions The Smart Way


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Thank Paul with a Coffee for more answers or donate to eff.org