Get a specific collection image link and title

EW_17
Tourist
11 0 3

Hi,

 

I want to create a page that contains some collections images and links.

 

Is there a way to get the collection title and image link using something specific for the collection (as an id), so the image will be changed in the page if we change it in the collection itself?

We need something dynamic.

 

Thanks in advance 

Replies 5 (5)

UmairA
Shopify Partner
1106 101 225

Hi @EW_17 ,

From what I understand, you want a custom page that showcases some specific collections because maybe you want a subcollection page. Am I right? I think your requirements are something similar to one of my client's e.g here is a similar page https://doyoutest.myshopify.com/pages/can-am that I made for that I client.

If that's what you want to achieve, then I can give you some rough idea and direction to get this task done, otherwise, you can hire an expert to code the entire page.

Let me know if you need my help.

Thanks

Umair Ababs

EW_17
Tourist
11 0 3

Hi,

 

Yes, that is what I want to create.

But the main idea is to create it as a dynamic.

So, in case a collection image changed from the collection page, we want it to be changed automatically in the page.

 

Thanks in advance for your help

UmairA
Shopify Partner
1106 101 225

@EW_17 , I see.

I'm including the code and it will work with your theme but the design might not be perfect.

{% for collection in collections %}
    {% if request.path contains '/pages/can-am' %}
      {% if collection.title == "CAN-AM ATV" or collection.title == "CAN-AM SIDE BY SIDE" or collection.title == "CAN-AM ROADSTER"%}
       <div class="cm_colec_col">
        <a href="{{collection.url}}">
       <div class="cm_colec_img"> 
         {% if collection.image %}
            <img src="{{ collection | img_url: '450x450' }}" alt="{{ collection.image.alt }}" />
         {% else %}
            <img src="{{ collection.products.first | img_url: '450x450' }}" alt="{{ collection.title | escape  }}" />
         {% endif %}
        </div>
        <div class="cm_colec_title"><span>{{collection.title}}</span></div>
        </a>
       </div>
     {% endif %}
   {% endif %}
{% endfor %}

Replace the collection.title value with your collection handle. It will loop through all the collections and display only the ones that you'll enter in collection.title value.

Hope that helps. 

Thanks

 

EW_17
Tourist
11 0 3

Great 😄

 

Thanks a lot

Yogi-surya
Visitor
1 0 0

Thanks for sharing this is useful for me.