Have your say in Community Polls: What was/is your greatest motivation to start your own business?

Change First Preview Image after Collection Load

Change First Preview Image after Collection Load

Restfulness
Visitor
2 0 0

Hello guys,

 

is it possible for an external image not present in the product to be loaded as a preview image for a specific collection? The image should only be loaded in the selected collection and should not be loaded generally in every collection. Also important, it should/may not appear in the product images.

Is such a change possible with little adjustment?

 

Thanks in advance for your help, I appreciate it.

 

My theme is „Craft 15.2.0“

 

Kind Regards,

Patrick

Replies 3 (3)

Sajat
Shopify Partner
311 35 45

Hi @Restfulness 

Welcome to Shopify Community.

You need to add some manual code ( with logic regarding collection and image) to do that.

 

You can check if the product is in desired collection, and if it is then you can show the image as the first image. 

Here is a sample code for reference.

 

 {% if product.collections[1].title == 'My Collection' %}
          <img src="https://upload.wikimedia.org/wikipedia/commons/b/bd/Test.svg" alt="test image">
        {% endif %}

This code goes on the snippets/product-media-gallery.liquid file; after  {%- if product.selected_or_first_available_variant.featured_media != null -%}

 

This should do the trick.

 

Thank you,

Sajat

-------------------------------------------------------------------------------------------
If this is helpful, please Like and Accept the solution.
Want to modify or custom changes on store? Let me help.

Restfulness
Visitor
2 0 0

Thank u for your Time.

 

Unfortunately this doesn't work somehow. The collection also contains several products that require a respective image, not all of them the same. I forgot to mention that at the beginning. I think this is a much bigger effort, right?

 

Thank you for all your efforts!

Sajat
Shopify Partner
311 35 45

Hi @Restfulness 

Thanks for the information.

Yes, if you require individual products to have respective individual image, then it is a bigger job. 

You can use Metafields to assign individual image on the products, the code the logic accordingly.

i.e. if the metafield, (say MainBlockImage) is present, then show the image first.

You will have to upload the image as Files from Content -> Files, and give the image URL on the metafields.

Hope this helps.

 

Thank you,

Sajat  

-------------------------------------------------------------------------------------------
If this is helpful, please Like and Accept the solution.
Want to modify or custom changes on store? Let me help.