mirror of
https://github.com/kemko/liquid.git
synced 2026-01-03 00:35:40 +03:00
117 lines
3.6 KiB
Plaintext
117 lines
3.6 KiB
Plaintext
<div id="page" class="innerpage clearfix">
|
|
<h1>{{ collection.title }} {{ product.title }}</h1>
|
|
|
|
|
|
<p class="latest-news"><strong>Product Tags: </strong>
|
|
{% for tag in product.tags %}
|
|
<a href="/collections/all/{{ tag }}">{{ tag }}</a> |
|
|
{% endfor %}
|
|
</p>
|
|
|
|
<div class="product clearfix">
|
|
<div class="product-info">
|
|
<h1>{{ product.title }}</h1>
|
|
<div class="product-info-description">
|
|
<p>{{ product.description }} </p>
|
|
</div>
|
|
|
|
{% if product.available %}
|
|
<form action="/cart/add" method="post">
|
|
|
|
<h2>Product Options:</h2>
|
|
|
|
<select id="product-info-options" name="id" class="product-info-options">
|
|
{% for variant in product.variants %}
|
|
<option value="{{ variant.id }}">{{ variant.title }} - {{ variant.price | money }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
|
|
<div id="price-field"></div>
|
|
|
|
<div class="product-purchase-btn">
|
|
<input type="submit" class="add-this-to-cart" id="add-this-to-cart" value="Add to Basket" />
|
|
</div>
|
|
|
|
</form>
|
|
{% else %}
|
|
<h2>Sold out!</h2>
|
|
<p>Sorry, we're all out of this product. Check back often and order when it returns</p>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="product-images clearfix">
|
|
{% for image in product.images %}
|
|
|
|
{% if forloop.first %}
|
|
<div class="product-image-large">
|
|
<img src="{{ image | product_img_url: 'medium'}}" alt="{{product.title | escape }}" />
|
|
</div>
|
|
{% else %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
|
|
<ul class="product-thumbs clearfix">
|
|
{% for image in product.images %}
|
|
{% if forloop.first %}
|
|
{% else %}
|
|
|
|
<li>
|
|
<a href="{{ image | product_img_url: 'large' }}" class="product-thumbs" rel="lightbox[product]" title="">
|
|
<img src="{{ image | product_img_url: 'small'}}" alt="{{product.title | escape }}" />
|
|
</a>
|
|
</li>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div id="three-reasons" class="clearfix">
|
|
<h3>Why Shop With Us?</h3>
|
|
<ul>
|
|
<li class="two-a">
|
|
<h4>24 Hours</h4>
|
|
<p>We're always here to help.</p>
|
|
</li>
|
|
<li class="two-c">
|
|
<h4>No Spam</h4>
|
|
<p>We'll never share your info.</p>
|
|
</li>
|
|
<li class="two-d">
|
|
<h4>Secure Servers</h4>
|
|
<p>Checkout is 256bit encrypted.</p>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- end page -->
|
|
|
|
<script type="text/javascript">
|
|
<!--
|
|
// prototype callback for multi variants dropdown selector
|
|
var selectCallback = function(variant, selector) {
|
|
if (variant && variant.available == true) {
|
|
// selected a valid variant
|
|
$('add-this-to-cart').removeClassName('disabled'); // remove unavailable class from add-to-cart button
|
|
$('add-this-to-cart').disabled = false; // reenable add-to-cart button
|
|
$('price-field').innerHTML = Shopify.formatMoney(variant.price, "{{shop.money_with_currency_format}}"); // update price field
|
|
} else {
|
|
// variant doesn't exist
|
|
$('add-this-to-cart').addClassName('disabled'); // set add-to-cart button to unavailable class
|
|
$('add-this-to-cart').disabled = true; // disable add-to-cart button
|
|
$('price-field').innerHTML = (variant) ? "Sold Out" : "Unavailable"; // update price-field message
|
|
}
|
|
};
|
|
|
|
// initialize multi selector for product
|
|
Event.observe(document, 'dom:loaded', function() {
|
|
new Shopify.OptionSelectors("product-info-options", { product: {{ product | json }}, onVariantSelected: selectCallback });
|
|
});
|
|
-->
|
|
</script>
|
|
|
|
|