Skip to content

Instantly share code, notes, and snippets.

@joeybeninghove
Created May 17, 2017 21:41
Show Gist options
  • Save joeybeninghove/d2ec6c54f666a3788060f0eb62ef7db5 to your computer and use it in GitHub Desktop.
Save joeybeninghove/d2ec6c54f666a3788060f0eb62ef7db5 to your computer and use it in GitHub Desktop.
product form markup
<div class="cart66 naked">
<div class="cart66-form">
<form accept-charset="UTF-8" action="/products/forms/add_to_cart" method="post">
<div style="margin:0;padding:0;display:inline">
<input name="utf8" type="hidden" value="✓">
<input name="authenticity_token" type="hidden" value="bMfr5cCyJKcxgSDdajlDe9NU7BlHeXScxhoGl3sRPPw=">
</div>
<input id="product_id" name="product_id" type="hidden" value="591a0c2d02aaaa20b0000059">
<input id="display" name="display" type="hidden" value="naked">
<input id="show_quantity" name="show_quantity" type="hidden" value="true">
<input id="show_price" name="show_price" type="hidden" value="true">
<input id="sku" name="sku" type="hidden" value="test">
<input id="cc_task" name="cc_task" type="hidden" value="add_to_cart">
<div class="cart66-product-option">
<div class="cart66-product-text-option">
<label class="cart66-label" for="options_591ca0a802aaaa2c00000001">Message</label>
<input class="cart66-single-line-text-field" id="options_591ca0a802aaaa2c00000001" maxlength="40" name="options[591ca0a802aaaa2c00000001]" type="text" value="">
<small class="cart66-field-hint">(max characters: 40)</small> <small class="cart66-price-change">+$10.00</small>
</div>
</div>
<div class="cart66-product-option">
<div class="cart66-product-text-option">
<label class="cart66-label" for="options_591ca0b302aaaa2c00000002">Long Message</label>
<textarea class="cart66-multi-line-text-field" id="options_591ca0b302aaaa2c00000002" maxlength="15" name="options[591ca0b302aaaa2c00000002]" rows="3"></textarea>
<small class="cart66-field-hint">(max characters: 15)</small> <small class="cart66-price-change">-$5.00</small>
</div>
</div>
<div class="cart66-product-option">
<div class="cart66-product-choice-option">
<label class="cart66-label" for="options_591ca0c202aaaa2c00000003">Color</label>
<div class="cart66-select-box-field">
<select id="options_591ca0c202aaaa2c00000003" name="options[591ca0c202aaaa2c00000003]">
<option class="cart66-select-option">
Select Color
</option>
<option class="cart66-select-option" selected="selected" value="591ca0c702aaaa2c00000004">
Red
</option>
<option class="cart66-select-option" value="591ca0cb02aaaa2c00000005">
Blue
</option>
</select>
</div>
</div>
</div>
<div class="cart66-product-option">
<div class="cart66-product-choice-option">
<label class="cart66-label" for="options_591cb7f302aaaa5993000003">Extras</label>
<div class="cart66-checkbox-field">
<label class="cart66-checkbox-label"><input id="options_591cb7f302aaaa5993000003_591cb7fd02aaaa5993000004" name="options[591cb7f302aaaa5993000003][591cb7fd02aaaa5993000004]" type="checkbox"> Extra 1 <small class="cart66-field-hint">+$3.00</small></label>
</div>
</div>
</div>
<div class="cart66-product-option">
<div class="cart66-product-choice-option">
<label class="cart66-label" for="options_591ca0db02aaaa2c00000006">Size</label>
<div class="cart66-radio-field">
<label class="cart66-radio-label"><input id="options_591ca0db02aaaa2c00000006_591ca0df02aaaa2c00000007" name="options[591ca0db02aaaa2c00000006]" type="radio"> Small <small class="cart66-field-hint"></small></label> <label class="cart66-radio-label"><input id="options_591ca0db02aaaa2c00000006_591ca0e902aaaa2c00000008" name="options[591ca0db02aaaa2c00000006]" type="radio"> Medium <small class="cart66-field-hint"></small></label>
</div>
</div>
</div>
<div class="cart66-quantity-field">
<label class="cart66-label" for="quantity">Quantity</label> <input name="quantity" type="text" value="1">
</div>
</form>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment