-
-
Save carolineschnapp/523455 to your computer and use it in GitHub Desktop.
<style> | |
#collections-listing ul { | |
list-style-type: none; | |
list-style-position: outside; | |
overflow: hidden; | |
} | |
#collections-listing ul li { | |
float: left; | |
width: 200px; | |
height: 300px; | |
margin-right: 30px; | |
} | |
#collections-listing ul li:Last-child { | |
margin-right: 0; | |
} | |
</style> | |
<div id="collections-listing">{% if linklists.featured-collections.links.size > 0 %} | |
<h2>Product Collections</h2> | |
<ul> | |
{% for link in linklists.featured-collections.links %} | |
{% assign collection = link.object %} | |
{% unless collection.handle == 'frontpage' %} | |
<li class="{{ collection.handle }}-collection"> | |
{% capture collection_title %}{{ collection.title | escape }}{% endcapture %} | |
<div class="collection"> | |
<div class="collection-image"> | |
<a href="{{ collection.url }}" title="Browse our {{ collection_title }} collection"> | |
{{ collection.products.first.featured_image | product_img_url: 'medium' | img_tag: collection_title }} | |
</a> | |
</div><!-- end of .collection-image --> | |
<div class="collection-description"> | |
<h3> | |
<a href="{{ collection.url }}" title="Browse our {{ collection_title }} collection"> | |
{{ collection.title }} | |
</a> | |
<small class="hint"> | |
{{ collection.all_products_count }} {{ collection.all_products_count | pluralize: 'item', 'items' }} | |
</small> | |
</h3> | |
</div><!-- end of .collection-description --> | |
</div><!-- end of .collection --> | |
</li> | |
{% endunless %} | |
{% endfor %} | |
</ul>{% else %} | |
<p>Please {{ 'create a link list' | link_to: '/admin/links' }} that contains links to all the collections you wish to feature on this page. The title of that link list must be <strong>Featured Collections</strong>. If you want your collections to be listed alphabetically, reorder them alphabetically on your {{ 'Navigation page' | link_to: '/admin/links' }}.</p>{% endif %} | |
</div><!-- end of #collection-listing --> |
I would like to get help with our collections too.. jeicob did you get an answer?
I've been working on a tutorial, http://www.tetchi.ca/shopify-theme-from-scratch/, and although it's not quite up to date, it's fairly easy to follow. However, I simply cannot get my /collections page to show up when I click on Catalog in the main menu. I want my customers to be able to pick which collection (category) of products they wish to inspect. I failed at getting a drop down menu to work also.
This github page was recommended to solve the problem of managing collections.
Maybe the code above goes in the list-collections.liquid file we made in the tutorial. That is just a wild guess. I'm afraid I'm just as lost as before. Anyone want to reach out and help us? Please?
Hi @jeicob, @MegiMoo and @Ubrwgn,
The code above does indeed go into the list-collections.liquid file
I just tried it out and it works perfectly. All I did was replace my existing code in list-collections.liquid with the above (note that you may need to tweak/remove the ul, li and h2/h3 tags to match your site's style).
Once the file is saved, go to 'Navigation' and add a new link list and name it 'Featured collections' and save it. You can then add the collection links and re-order them as needed. Hope this helps!
This still isnt working for me.
I've pasted the code in, created the link list and added it to the navigation. However, when I click on Featured collections on the navigation bar on my store, it brings me to /collections and shows all my collections in alphabetical order (basically the default). What am I missing here?
Also, isn't there a way to name the collection other than "Featured collections"? And can this functionality be applied to several collections? The goal here being to create a Shoes collection and a Pants collection for instance.
Thanks in advance.
Am I correct in thinking there's no way to paginate the out put of the link list method?
thanks
Thanks
Hello, how are you? I am new in shopify and wanted to organize the order of our collections and we have been told to use this code, but we have no idea even where to paste it or what to do afterwords, any help?