Product Type in Collection

hwdesign
New Member
7 0 0

There are a few threads about retrieving a list of Product Types for a specific collection, but I'm a noob and I can't figure out what I'm doing wrong.

My site is http://shop.finnsfinds.com/

I have collections like Baby Boy, Baby Girl, etc. And I'd like visitors to be able to select a product type, like Shirts, Pants, Dresses, from within that collection.

Using the code below, I'm only able to show visitors all products of a particular type, as opposed to just those in the current collection:

{% assign typeList = '' %}
{% assign collect_handle = collection.handle %}
{% for prod in collections[collect_handle].all_products %}
  {% unless typeList contains prod.type %}
    <li>{{ prod.type | link_to_type }}</li>
    {% capture tempList %}{{ typeList }}{{ prod.type }}{% endcapture %}
    {% assign typeList = tempList %}
  {% endunless %}									
{% endfor %}
Any help would be greatly appreciated.

Replies 21 (21)
Jamie
Shopify Staff (Retired)
5711 0 159

Try:

 

<H2>Product Types</H2>

{% paginate collection.products by 1000 %}

{% for product in collection.products %}

  <li>{{ product.type | link_to_type }}</li>

{% endfor %}

{% endpaginate %}

 

 


http://shopifyplus.com ::: http://twitter.com/bacchus
Jamie
Shopify Staff (Retired)
5711 0 159

I am assuming this will go in your collection.liquid file. If it's in the theme file then you need to add a conditional {% if collection %}

http://shopifyplus.com ::: http://twitter.com/bacchus
hwdesign
New Member
7 0 0

This produced duplicate menu links like this:

Shirts

Shirts

Pants

Pants

Neither of them were collection specific...

And yes, this is in the theme file.

The whole code for my menu bar looks like this:

 

<div class="side-navigation">
        <ul id="side-navigate">    				
  	    {% for link in linklists.side-nav.links %}  			      			  
  	    <li>
  		{% if collection.title == link.title %}
    		       {% capture src %}btn.side-nav.{{ link.title | replace: ' ', '-' }}_active.jpg{% endcapture %}
    		       <a href="{{ link.url }}"><img class="current-collection" src="{{ src | asset_url }}" title="{{ link.title }}" /></a>
    		       {% else %}  
    		       {% capture src %}btn.side-nav.{{ link.title | replace: ' ', '-' }}.jpg{% endcapture %}
    	               <a href="{{ link.url }}"><img src="{{ src | asset_url }}" title="{{ link.title }}" /></a>
    	        {% endif %}
  				    
  		{% if collection.title == link.title %}
    			<ul class="tags">
    			{% for tag in collection.all_tags %}
    			{% capture tag_url %}{{link.url}}/{{tag | replace: ' ', '-'}}{% endcapture %}
                  <li>
                    <a href="{{ tag_url }}">{{tag}}</a>
                  </li>
                {% endfor %}

<!-- PROBLEM STARTS HERE -->

{% if collection %}
{% assign typeList = '' %}
{% assign collect_handle = collection.handle %}
{% for prod in collections[collect_handle].all_products %}
  {% unless typeList contains prod.type %}
    <li>{{ prod.type | link_to_type }}</li>
    {% capture tempList %}{{ typeList }}{{ prod.type }}{% endcapture %}
    {% assign typeList = tempList %}
  {% endunless %}									
{% endfor %}
{% endif %}

<!-- PROBLEM ENDS HERE -->

    				  </ul>
    				  {% endif %}
  				  </li>  				  
  				{% endfor %}
  			</ul>
      </div>

 

Jamie
Shopify Staff (Retired)
5711 0 159

Sorry Rob, I jumped the gun. I have this snippet working on a site, but in a collection "all", and in the collection template, with a ton of conditionals. I was hoping without testing.

You're in a loop so you're getting one link per instance of that product type in the present collection, when not in a collection of everything.

I'll have to put this in a test shop in the morning and have a closer looky loo.

http://shopifyplus.com ::: http://twitter.com/bacchus
hwdesign
New Member
7 0 0

Thanks Jamie, I really appreciate it.

Jamie
Shopify Staff (Retired)
5711 0 159

I can't resist a good puzzle even when I'm exhausted =) Try this:

 

{% if collection %}
{% assign typeList = ',' %}
{% assign colHandle = collection.handle %}
{% for product in collections.[colHandle].all_products %}
     {% capture compareType %},{{product.type}},{% endcapture %}
        {% if typeList contains compareType %}{% else %}
               <li>{{ product.type | link_to_type }}</li>
               {% capture tempList %}{{typeList}}{{product.type}},{% endcapture %}
               {% assign typeList = tempList %}
    {% endif %}
{% endfor %}
{% endif %}

Getting consistent results in a test bed.

 

http://shopifyplus.com ::: http://twitter.com/bacchus
Jamie
Shopify Staff (Retired)
5711 0 159

You have to remember too that you will get an empty result on the type based collections (/types?q=Foo+Bar) so you need to account for that in your mark-up.

http://shopifyplus.com ::: http://twitter.com/bacchus
hwdesign
New Member
7 0 0

Thanks! This totally worked!

*EDIT* I jumped the gun here. Not quite working yet...

<div class="side-navigation">
        <ul id="side-navigate">    				
  			  {% for link in linklists.side-nav.links %}  			      			  
  				  <li>
  				    {% if collection.title == link.title %}
    			      {% capture src %}btn.side-nav.{{ link.title | replace: ' ', '-' }}_active.jpg{% endcapture %}
    			      <a href="{{ link.url }}"><img class="current-collection" src="{{ src | asset_url }}" title="{{ link.title }}" /></a>
    			    {% else %}  
    			      {% capture src %}btn.side-nav.{{ link.title | replace: ' ', '-' }}.jpg{% endcapture %}
    			      <a href="{{ link.url }}"><img src="{{ src | asset_url }}" title="{{ link.title }}" /></a>
    			    {% endif %}
  				    
  				    {% if collection.title == link.title %}
    				  <ul class="tags">
    				    {% for tag in collection.all_tags %}
    				    {% capture tag_url %}{{link.url}}/{{tag | replace: ' ', '-'}}{% endcapture %}
                  <li>
                    <a href="{{ tag_url }}">{{tag}}</a>
                  </li>
                {% endfor %}

<!-- PROBLEM AREA -->

{% if collection %}
{% assign typeList = ',' %}
{% assign colHandle = collection.handle %}
{% for product in collections.[colHandle].all_products %}
     {% capture compareType %},{{product.type}},{% endcapture %}
        {% if typeList contains compareType %}{% else %}
               <li>{{ product.type | link_to_type }}</li>
               {% capture tempList %}{{typeList}}{{product.type}},{% endcapture %}
               {% assign typeList = tempList %}
    {% endif %}
{% endfor %}
{% endif %}

<!-- END PROBLEM AREA -->

    				  </ul>
    				  {% endif %}
  				  </li>  				  
  				{% endfor %}
  			</ul>
      </div>

Jamie
Shopify Staff (Retired)
5711 0 159

You're welcome! :)

http://shopifyplus.com ::: http://twitter.com/bacchus