Liquid - Modules

<div class="cartSummaryContainer">
 <div class="cartSummaryContent">
  {% if cart.totalItems == 0 -%}
    <div class="cartSummaryItem">{{resources.shoppingCartEmpty}}</div>
  {% else -%}
    <div class="cartSummaryItem">{{cart.totalItems}} item(s) Total: {{cart.totalAmount}}<a href="{{cart.viewCartUrl}}" class="cartSummaryLink">{{resources.viewCartText}}</a></div>
  {% endif -%}
 </div>
</div>
<script text="text/javascript">
  if (!window.Cart) window.Cart={};
  Cart.refreshCart=function() {
    jQuery('.cartSummaryContainer').load('/ModuleRender.aspx?module=module_cartSummary&template=/_System/ModuleTemplates/Shop/cartSummary.html .cartSummaryContent');
  }
</script>

{module_cartsummary}

<ul class="catalogList">
{% for catalog in catalogs %}
    <li> {{catalog.name}} - {{catalog.parent.name}}</li>
{% endfor %}
</ul>

{% assign navigation = catalogs.nav %}
{% include "/_System/ModuleTemplates/Shop/navigation_paged.html" %}

{module_catalogList parentCatalogId="2", sortBy="name asc", itemsPerPage="5", template="/_System/ModuleTemplates/Shop/catalogList.html"}

<div class="shop-catalogue clear">
    <h4>{{catalog.name}}</h4>
    <div class="image">
        <a title="{{catalog.name}}" href="{{catalog.url}}">
            <img alt="{{catalog.name}}" src="{{catalog.image}}" />
        </a>
    </div>
</div>

{module_catalog catalogId="2" template="/_System/ModuleTemplates/Shop/catalog.html"}

<span>
{% if crumbs.size == 0 -%}
  Online Shop
{% else -%}
  {% for crumb in crumbs -%}
    {% if forloop.last == true -%}
      <span>{{crumb.label}}</span>
    {% else -%}
      <a href="{{crumb.url}}">{{crumb.label}}</a> -
    {% endif -%}
  {% endfor -%}
{% endif -%}
</span>

{module_catalogbreadcrumb}

<ul class="productList">
{% for product in products %}
    <li>
        {module_product productId="{{product.Id}}" catalogId="{{product.catalogId}}" template="/_System/ModuleTemplates/Shop/ProductSmall.html"}
    </li>
    {% endfor %}
</ul>

{% assign navigation = products.nav %}
{% include "/_System/ModuleTemplates/Shop/navigation_paged.html" %}

{module_productList catalogId="2" onSale="true" price="between(100,500)" sortBy="weighting asc" itemsPerPage="5" template="/_System/ModuleTemplates/Shop/productList.html"}

<h3>Product Search Results:</h3>
<ul>
{% for product in products %}
    <li>
        {module_product productId="{{product.Id}}" catalogId="{{product.catalogId}}" template="/_System/ModuleTemplates/Shop/ProductSmall.html"}
    </li>
{% endfor %}

{% if products.navigation.totalProductsFound == 0 %}
        <li>Your search returned no results.</li>
{% endif %}
</ul>

{% assign navigation = products.nav %}
{% include "/_System/ModuleTemplates/Shop/navigation.html" %}

{module_productSearchResult itemsPerPage="5" sortBy="name asc" template="/_System/ModuleTemplates/Shop/productSearchResult.html"}

<script type="text/javascript" src="/js/onlineShop.js"></script>
<div class="shop-product-large">
<div class="details">
<h1><a href="{{product.url}}">{{product.name}}</a></h1>
<ul>
    <li class="price"><strong>{{product.price}}</strong></li>
    <li class="instock">In stock: <strong>{{product.inStock}}</strong></li>
    <li class="quantity">
        <input id="qty_{{product.id}}" class="productTextInput" name="AddToCart_Amount" type="text" value="{{product.minUnits}}">
        <img alt="" src="/CatalystImages/shop_addtocart.png" onclick="Cart.AddToCart('{{product.id}}', '{{product.catalogId}}', 'qty_{{product.id}}', onSuccess, onError, 'relatedProducts_{{product.id}}', 'productAttributes_{{product.id}}');" />
    </li>
</ul>
<script type="text/javascript">
function onSuccess(results) {
    return Cart.onSuccess(results);
}
function onError(results) {
    return Cart.onError(results);
}
</script>

{% comment %} list of links to products in the same group {% endcomment %}
{% if product.productGroup.products.size > 0 -%}
<ul class="groupedProducts">
{% for productGroupItem in product.productGroup.products  -%}<!-- sorted by weighting -->
    <li><a href="{{productGroupItem.url}}">{{productGroupItem.name}}</a></li>
{% endfor -%}
</ul>
{% endif -%}

{% comment %} droddown to products in the same group (changes location on change) {% endcomment %}
{% if product.productGroup.products.size > 0 -%}
<select onchange="document.location=jQuery('option:selected',this).val();">
{% for productGroupItem in product.productGroup.products -%}<!-- sorted by weighting -->
    <option value="{{productGroupItem.url}}"{% if (productGroupItem.id == product.id) %} selected="selected"{% endif %} >{{productGroupItem.name}}</option>
{% endfor -%}
</select>
{% endif -%}

<div class="description">{{product.description}}</div>
<div class="image"><a href="product.url"><img id="catlproduct_{{product.id}}" src="{{product.largeImage}}" alt="{{product.name}}" border="0"/></a>

{% comment %} For small product detail list (doesn't need id, because it has its own add to cart mechanism) {% endcomment %}
{% if product.relatedProducts.size -%}
<ul class="relatedProducts">
{% for relatedProduct in product.relatedProducts -%}
    <li>{module_product productId="{{relatedProduct.Id}}" catalogId="{{relatedProduct.catalogId}}" template="/_System/ModuleTemplates/Shop/productSmall.html"}</li>
{% endfor -%}
</ul>
{% endif -%}

{% comment %} For checkbox product list (the id is used in Add to cart for the parent product) {% endcomment %}
{% if product.relatedProducts.size -%}
<ul class="relatedProducts" id="relatedProducts_{{product.id}}">
{% for relatedProduct in product.relatedProducts  -%}
    <li><input type="checkbox" name="relatedProduct_{{product.id}}" id="relatedProduct_{{relatedProduct.id}}" value="{{relatedProduct.id}}"/><label for="relatedProduct_{{relatedProduct.id}}">{{relatedProduct.name}}</label></li>
{% endfor -%}
</ul>
{% endif -%}

{% if product.attributes.size -%}
<ul class="attributes"  id="productAttributes_{{product.id}}">
{% for attrGroup in product.attributes  -%}
    <li><div id="attrGroup_{{attrGroup.id}}" class="attributeGroup{% if attrGroup.isMandatory %} mandatory{% endif %}"><label for="attrGroup_{{attrGroup.id}}">{{attrGroup.name}}:</label>
    {% case attrGroup.fieldType -%}
    {% when 'Radio' -%}
        <ul class="radio">
        {% for attr in attrGroup.items  -%}
            <li>
                <input type="radio" name="{{attrGroup.name}}" value="{{attr.id}}" id="attr_{{attr.id}}"/>
                <label for="attr_{{attr.id}}">{{attr.name}} ({{attr.price}})</label>
                {% if attr.image.size > 0 %}<img src="{{attr.image}}"/>{% endif %}
            </li>
        {% endfor -%}
        </ul>
    {% when 'CheckBox' -%}
        <ul class="checkbox">
        {% for attr in attrGroup.items  -%}
            <li>
                <input type="checkbox" name="{{attrGroup.name}}" value="{{attr.id}}" id="attr_{{attr.id}}"/>
                <label for="attr_{{attr.id}}">{{attr.name}} ({{attr.price}})</label>
                {% if attr.image.size > 0 %}<img src="{{attr.image}}"/>{% endif %}
            </li>
        {% endfor -%}
        </ul>
    {% else -%}
        <select class="dropdown" name="{{attrGroup.name}}">
            <option value="">-- Please Select --</option>
        {% for attr in attrGroup.items  -%}
            <option value="{{attr.id}}">{{attr.name}} ({{attr.price}})</option>
        {% endfor -%}
        </select>
    {% endcase -%}
    </div></li>
{% endfor -%}
</ul>
{% endif -%}

{% if product.thumbnails.size -%}
<ul class="poplets">
{% for thumbnail in product.thumbnails  -%}
    <li><img src="{{thumbnail.imageURL}}" /> - <img src="{{thumbnail.imageUrl}}?action=resize&amp;width=65&amp;height=65" /></li>
{% endfor -%}
</ul>
{% endif -%}

</div>
</div>

</div>
<div class="comment-form">
<h5>Comment</h5>
<form action="/RatingProcess.aspx?OID={module_oid}&amp;OTYPE={module_otype}" method="post" onsubmit="return checkWholeForm2343(this)" name="catratingform2343">
    <div class="form">
    <div class="item">   <label>Was this helpful?</label><br />
    No   <input type="radio" value="1" name="Rating" />   <input type="radio" value="2" name="Rating" />   <input type="radio" value="3" checked="checked" name="Rating" />   <input type="radio" value="4" name="Rating" />   <input type="radio" value="5" name="Rating" />   Very   </div>
    <div class="item">   <label>Name (optional)</label><br />
    <input type="text" maxlength="255" name="FullName" class="cat_textbox_small" />   </div>
    <div class="item">   <label>Website (optional)</label><br />
    <input type="text" maxlength="255" name="Website" class="cat_textbox_small" />   </div>
    <div class="item">   <label>Email Address (optional)</label><br />
    <input type="text" maxlength="255" name="EmailAddress" class="cat_textbox_small" />   </div>
    <div class="item">   <label>Enter Word Verification in box below</label><br />
    {module_captchav2}   </div>
    <div class="item">   <label>Comment (optional)</label><br />
    <textarea name="Feedback" class="cat_listbox_small"></textarea>   </div>
    <div class="item">   <input type="submit" value="Submit" class="cat_button" />   </div>
    </div>
    <script type="text/javascript" src="/CatalystScripts/ValidationFunctions.js"></script>
    <script type="text/javascript">   //<![CDATA[
   function checkWholeForm2343(theForm){var why = "";if (theForm.EmailAddress) if (theForm.EmailAddress.value.length > 0) why += checkEmail(theForm.EmailAddress.value);if (theForm.CaptchaV2) why += isEmpty(theForm.CaptchaV2.value, "Enter Word Verification in box below");if (why != ""){alert(why);return false;}theForm.submit();return false;}   
//]]>                                </script>
</form>
</div>

<ul class="shop-productList">
    {% for prd in products %}
    <li>
        {module_product productId="{{prd.Id}}" catalogId="{{prd.catalogId}}" template="/_System/ModuleTemplates/Shop/productSmall.html"}
    </li>
    {% endfor %}
</ul>