_product partial - CrystalCommerce Liquid Documentation for Designers

_product partial

File: _product.liquid

Default Liquid Template

<tr id="{{ product.row_id }}" class="product_row {% if product.preorder? %} preorder{% endif %}">

  <td valign="top">
    {% if product.main_photo != false %}
      <a id="thumb{{ product.id }}" href="{{ product.large_photo }}" class="highslide thumbnail" onclick="return hs.expand(this)"><img src="{{ product.thumb_photo }}" title="{{ "product.enlarge_photo" | trans }}" /></a>
      <div class="highslide-caption product_controls" id="caption-for-thumb{{ product.id }}">
        {{ "product.howto_navigate_photos" | trans }}<br />
        <a href="{{ product.buylist_aware_url }}">{{ "product.view_details" | trans }}</a>
      </div>
    {% endif %}
  </td>

  <td width="100%" valign="top">
    <a href="{{ product.buylist_aware_url }}">{{ product.name }}</a>
    {% if product.preorder? %}
      <span class="preorder_date">{{ "product.preorder_now_with_date" | trans, "available_on", product.available_on }} </span>
    {% endif %}
    {% if product.domestic_only? %}
      <div class="domestic_only">{{ "product.domestic_only" | trans }}</div>
    {% endif %}
    <br />
    {% if descriptors.size > 0 %}
      <span class="product_descriptors">
      {% for descriptor in descriptors %}
        {% unless descriptor.description == "Card Text" or descriptor.description == "Card Rules" %}
          <span class="descriptor_description">{{ descriptor.description }}</span>: <span class="descriptor_value">{{ product | descriptor_value: descriptor }}</span>
          {% unless descriptor == descriptors.last %}|{% endunless %}
        {% endunless %}
      {% endfor %}
      </span>
    {% endif %}
    <table class="invisible-table" style="width:100%">
      {% if product.variants.size > 0 %}
        {% for variant in product.variants %}
          <tr id="variant_{{ variant.id }}" class="variantRow">
            <td class="variant_info"><span class="category_name">{{ product.category.name }}</span>: <span class="variant_info">{{ variant.short_info }}</span></td>
            <td class="price">
              {% unless product.buylist_mode? %}
                {% if product.msrp_to_f > variant.sell_price_to_f %}
                  <span class="msrp price">{{ product.msrp | money }}</span>
                {% endif %}
              {% endunless %}
              {{ variant.price | money }}
            </td>
            <td class="qty">
              {% unless variant.infinite_qty? %}
                  x {{ variant.qty }}
              {% endunless %}
            </td>
            <td class="buy_button">
              {% if site.may_add_to_cart? %}
                {% if product.preorder? %}
                  {{ "product.preorder_now_button" | trans | link_to_add_cart_with_qty: product, variant }}
                {% else %}
                  {{ "product.buy_button" | trans | link_to_add_cart_with_qty: product, variant }}
                {% endif %}
              {% endif %}
            </td>
          </tr>
        {% endfor %}
      {% elsif product.buylist_mode? %}
        <tr class="not_on_buylist_product">
          <td class="variant_info" colspan="4"><span class="category_name">{{ product.category.name }}</span>: <span class="info">{{ "product.not_on_buylist" | trans }}</span></td>
        </tr>
      {% else %}
        <tr class="wishlist_product">
          <td class="variant_info" colspan="2"><span class="category_name">{{ product.category.name }}</span>: <span class="info">{{ "product.no_conditions_in_stock" | trans }}</span></td>
          <td class="price">{{ product.sell_price | money }}</td>
          <td class="wishlist_button">{{ "product.add_to_wishlist_button" | trans | link_to_add_wishlist: product }}</td>
        </tr>
      {% endif %}
    </table>
  </td>
</tr>

Default Mobile Liquid Template

<li id="{{ product.row_id }}" class="product_row {% cycle 'odd', 'even' %}{% if product.preorder? %} preorder{% endif %}">

  <div class="image">
    {% unless product.main_photo == false %}
      <a id="thumb{{ product.id }}" href="{{ product.buylist_aware_url }}" class="thumbnail"><img src="{{ product.thumb_photo }}" title="{{ product.name }}" /></a>
    {% endunless %}
  </div>

  <div class="info">
    <h4 class="name">
      <a href="{{ product.buylist_aware_url }}">{{ product.name }}</a>
    </h4>
    {% if product.search? %}
    <h5 class="category">
      <a href="{{ product.category.url }}">{{ product.category.name}}</a>
    </h5>
    {% endif %}
    {% if product.preorder? %}
      <div class="preorder_date">Preorder now! Available on {{ product.available_on }}</div>
    {% endif %}
    {% if product.domestic_only? %}
      <div class="domestic_only">Cannot be sold internationally.</div>
    {% endif %}
    <div class="product_descriptors">
      {% for descriptor in product.descriptors %}
        {% unless descriptor.name == "Card Text" or descriptor.name == "Card Rules" %}
          <span class="descriptor">
            <span class="descriptor_name">{{ descriptor.name }}</span>:
            <span class="descriptor_value">{{ descriptor.value }}</span>
          </span>
          {% unless forloop.last %}|{% endunless %}
        {% endunless %}
      {% endfor %}
    </div>
    {% if site.buylist_mode? %}
      {% if product.wtb_qty > 0 %}
        <p>
          We're looking to buy
          <span class="qty">{{ product.wtb_qty }}</span>
          starting at
          <span class="price">{{ product.price_range.max | money }}</span>.
        </p>
      {% else %}
        <p>Not currently on our buylist.</p>
      {% endif %}
    {% else %}
      {% if product.has_variants_with_infinite_qty? %}
        <p>
          In stock starting at 
          <span class="price">{{ product.price_range.min | money }}</span>.
        </p>
      {% elsif product.qty > 0 %}
        <p>
          <span class="qty">{{ product.qty }}</span>
          in stock starting at 
          <span class="price">{{ product.price_range.min | money }}</span>.
        </p>
      {% else %}
        <p>No conditions in stock.</p>
      {% endif %}
    {% endif %}
  </div>

  <div class="add_to_cart_buttons">
    {% if site.catalog_mode? %}
      {% if product.in_stock? %}
        <form method="post" action="/cart/add" class="add_to_cart_form">
          {{ token_tag }}
          <select name="vid" id="vid_select_{{ product.id }}" class="vid_select">
          {% for variant in product.variants %}
            {% if variant.infinite_qty? %}
              <option value="{{ variant.id }}"{% if variant.default? %} selected="selected"{% endif %}>{{ variant.short_info }} ({{ variant.price | money }})</option>
            {% else %}
              <option value="{{ variant.id }}"{% if variant.default? %} selected="selected"{% endif %}>{{ variant.short_info }} ({{ variant.qty }} in stock) ({{ variant.price | money }})</option>
            {% endif %}
          {% endfor %}
          </select>
          <select name="qty" id="qty_select_{{ product.id }}">
          {% comment %} What arbitrary qty limit do we set for infinite product? {% endcomment %}
          {% if product.has_variants_with_infinite_qty? %}
            {% assign maxqty = 12 %}
          {% else %}
            {% if product.qty > 12 %}
              {% assign maxqty = 12 %}
            {% else %}
              {% assign maxqty = product.qty %}
            {% endif %}
          {% endif %}
          {% for i in (1..maxqty) %}
            <option value="{{ i }}">{{ i }}</option>
          {% endfor %}
          </select>
          <button id="add_{{ product.id }}">Add to Cart</button>
        </form>
      {% endif %}
    {% elsif site.buylist_mode? and product.wtb_qty > 0 %}
      <form method="post" action="/buy_orders/add" class="add_to_cart_form">
        {{ token_tag }}
        <select name="vid" id="vid_select_{{ product.id }}" class="vid_select">
        {% for variant in product.variants %}
          <option value="{{ variant.id }}"{% if variant.default? %} selected="selected"{% endif %}>{{ variant.short_info }} ({{ variant.wtb_qty }} to buy) ({{ variant.buy_price | money }})</option>
        {% endfor %}
        </select>
        <select name="qty" id="qty_select_{{ product.id }}">
        {% if product.wtb_qty > 12 %}
          {% assign wtb_qty = 12 %}
        {% else %}
          {% assign wtb_qty = product.wtb_qty %}
        {% endif %}
        {% for i in (1..wtb_qty) %}
          <option value="{{ i }}">{{ i }}</option>
        {% endfor %}
        </select>
        <button id="add_{{ product.id }}">Add to Buylist</button>
      </form>
    {% endif %}
  </div>

  <div class="clear"></div>
</li>