Skip to content

Instantly share code, notes, and snippets.

@carolineschnapp
Created October 9, 2011 00:14
Show Gist options
  • Save carolineschnapp/1273086 to your computer and use it in GitHub Desktop.
Save carolineschnapp/1273086 to your computer and use it in GitHub Desktop.
debug-panel.liquid
<div id="shopify-product-customization-help">
<h6 class="title">Product Customization Help</h6>
<ul class="links">
<li>
<a class="clear-attributes" href="#" title="Clear all customization attributes" onclick="Shopify.Customizr.clearAttributes();return false;">Clear attributes</a>
</li>
<li>
<a class="inspect-attributes" href="#" title="Inspect attributes" onclick="Shopify.Customizr.inspectAttributes('attributes-wrapper');return false;">Inspect attributes</a>
</li>
<li>
<a class="hide-overlay" href="#" title="hide this overlay" onclick="var div=document.getElementById('shopify-product-customization-help');div.style.top='-'+div.offsetHeight+'px';return false;">X</a>
</li>
</ul>
<div class="response">
<div id="attributes-wrapper" style="white-space: pre"></div>
<a id="hide-attributes" style="display:none" href="#" title="Hide attributes" onclick="var div=document.getElementById('attributes-wrapper');div.style.display='none';this.style.display='none';return false;">Hide attributes</a>
</div>
</div>
<style>
#shopify-product-customization-help * {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font: normal normal bold 14px "Helvetica Neue", Helvetica, Arial;
vertical-align: baseline;
background: transparent;
line-height: 1;
color: #8D785A;
}
#shopify-product-customization-help {
position: fixed;
top: 0px;
right: 0px;
padding: 10px 0px 15px 10px;
line-height: 1;
background: #FFFBE5;
border-width: 0 0 2px 2px;
border-style: solid;
border-color: #EFEBD5;
z-index: 2147483647;
transition: all .2s linear;
-o-transition: all .2s linear;
-moz-transition: all .2s linear;
-webkit-transition: all .2s linear;
overflow: auto;
max-height: 400px;
width: auto;
}
#shopify-product-customization-help .title {
margin: 5px;
}
#shopify-product-customization-help .links {
margin: 5px;
}
#shopify-product-customization-help ul {
list-style: none;
display: inline;
}
#shopify-product-customization-help li {
display: inline;
}
#shopify-product-customization-help a {
padding: 5px;
}
#shopify-product-customization-help div {
margin: 10px;
font-family: monospace;
line-height: 1.3;
}
</style>
@Mobitics
Copy link

Hi Caroline, I am using the customizr on my shop, but I want to use radio buttons instead of the dropdown that the product template has. However, when I change to radio buttons, the product options only get added to cart when I select the first option. With the other two it does not work...any ideas?

Here is the code I am using to product the radio buttons:

{% for variant in product.variants %} {{ variant.title }} - {{ variant.price | money }} {% endfor %}

This is the live product page: http://project-juice.myshopify.com/products/beginner-can-you-kick-it
(password: juice)

Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment