-
-
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'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
I would like to get help with our collections too.. jeicob did you get an answer?