Minimal theme collection.liquid with sidebar on the right - 3 products per row.
<div id="collection"> | |
{% paginate collection.products by 18 %} | |
<div class="row"> | |
<div class="span9 products"> | |
<div class="row"> | |
<!-- Begin breadcrumb --> | |
<div class="breadcrumb clearfix"> | |
<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="{{ shop.url }}" title="{{ shop.name | escape }}" itemprop="url"><span itemprop="title">Home</span></a></span> | |
<span class="arrow-space">></span> | |
<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="{{ collection.url }}" title="{{ collection.title | escape }}" itemprop="url"><span itemprop="title">{{ collection.title }}</span></a></span> | |
{% if current_tags %} | |
{% for tag in current_tags %} | |
<span class="arrow-space">></span> | |
<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="/collections/{% if collection.handle != blank %}{{ collection.handle }}{% else %}all{% endif %}/{{ tag | handleize }}" title="{{ tag | escape }}" itemprop="url"><span itemprop="title">{{ tag }}</span></a></span> | |
{% endfor %} | |
{% endif %} | |
{% if paginate.pages != 0 %} | |
<span class="arrow-space">></span> <strong>Page {{ paginate.current_page }} of {{ paginate.pages }}</strong> | |
{% endif %} | |
</div> | |
<!-- End breadcrumb --> | |
<!-- Begin sort collection --> | |
<div class="clearfix"> | |
<h1 class="collection-title">{{ collection.title }}</h1> | |
{% if settings.collection_tags %} | |
{% capture col_url%}{% if collection.url.size == 0 %}/collections/all{%else%}{{collection.url}}{%endif%}{%endcapture%} | |
{% if collection.all_tags.size > 0 %} | |
<div class="browse-tags"> | |
<label>Browse:</label> | |
<select name="collection_tags" id="collection_tags" class="loc_on_change"> | |
<option value="{{ col_url }}">All items</option> | |
{% for tag in collection.all_tags %} | |
<option value="{{col_url}}/{{ tag | handle }}"{% if current_tags contains tag %} selected="selected"{%endif%}>{{ tag }}</option> | |
{% endfor %} | |
</select> | |
</div> | |
{% endif %} | |
{% endif %} | |
</div> | |
<!-- End sort collection --> | |
<!-- Begin collection description --> | |
{% if collection.description != "" %} | |
{{ collection.description }} | |
{% endif %} | |
<!-- End collection description --> | |
<!-- Begin no products --> | |
{% if collection.products.size == 0 %} | |
<div class="row"> | |
<div class="expanded-message"> | |
<p>No products found</p> | |
</div> | |
</div> | |
{% endif %} | |
</div> | |
<div class="row"> | |
{% for product in collection.products limit: settings.pagination_limit %} | |
{% capture collection_handle %}{{ collection.handle }}{% endcapture %} | |
{% capture url %}{% if collection_handle != "" %}/collections/{{ collection.handle }}{{ product.url }}{% else %}{{ product.url }}{% endif %}{% endcapture %} | |
<div class="product span3 {% cycle 'class-product-loop': 'inner-left', '', 'inner-right' %}"> | |
{% if product.price_min < product.compare_at_price_min %} | |
{% if settings.show_sale_circle %} | |
<span class="circle sale">Sale</span> | |
{% endif %} | |
{% endif %} | |
<div class="image"> | |
<a href="{{ url }}"> | |
<img src="{{ product.featured_image | product_img_url: 'large' }}" alt="{{ product.title | escape }}" /> | |
</a> | |
</div> | |
<div class="details"> | |
<a href="{{ url }}" class="clearfix"> | |
<h4 class="title">{{ product.title }}</h4> | |
{% if settings.product_vendor %} | |
<span class="vendor">{{ product.vendor }}</span> | |
{% endif %} | |
<span class="price"> | |
{% if product.available %} | |
{% if product.compare_at_price_max > product.price %} | |
<del>{{ product.compare_at_price | money }}</del> | |
{% endif %} | |
{% if product.price_varies %} | |
<small><em>from</em></small> | |
{% endif %} | |
{{ product.price | money }} | |
{% else %} | |
{{ product.price | money }} Sold Out | |
{% endif %} | |
</span> | |
</a> | |
</div> | |
</div> | |
{% cycle 'clear-product-loop': '', '', '<div style="clear:both;"></div>' %} | |
{% endfor %} | |
</div> | |
</div><!-- .products --> | |
<div class="span3"> | |
{{ '219x1000.gif' | asset_url | img_tag }} | |
</div> | |
{% include 'pagination' %} | |
</div><!-- .row --> | |
{% endpaginate %} | |
</div><!-- #collection --> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment