Product Options and Attributes

Display Product Options Dropdown Selector - Product Page

{% if product.options.count %}
  {% for index, option in product.options %}
    <div class="product-options col-md-6">
      <p class="title" for="{{ 'option-'~index }}">{{ option.name }}</p>
      <span class="col-md-12 custom-dropdown">
      <select id="{{ 'option-'~index }}" name="options[{{ option.id }}]" class="select-option" data-ajax-handler="shop:product" data-ajax-update="#product-page=shop-product">
        {% for key, value in option.values %}
          <option value="{{ key }}" {{ option_state(postedOptions[option.id], key) }}>{{ value }}</option>
        {% endfor %}
      </select>
      </span>
    </div>
  {% endfor %}
{% endif %}

Display Cart Item Options - Cart Page

{% for item in items %}
    ...
    {% set options = item.optionsString() %}
    {% if options %}
        <p class="h6">{{ options|unescape }}</p>
    {% endif %}
{% endfor %}

Display Product Attributes

{% for attribute in product.productAttributes %}
   {{ attribute.name }}
   {{ attribute.value }}
{% endfor %}