Multiple attributes without variants in Shopify

As promised over there, I will present you with the algorithm and the JavaScript code needed to implement multiple attributes for products in Shopify without variants. With this method, you are not squandering any of your precious SKUs, and you are avoiding the long dreaded drop-down variant selection box of death:

Blue - Degradable within a week
Blue - Plastic
Blue - Faux leather
Yellow - Degradable within a week
Yellow - Plastic
Yellow - Faux leather
Black - Degradable within a week
Black - Plastic
Black - Faux leather
Shit brown - Degradable within a week
Shit brown - Plastic
Shit brown - Faux leather
Green - Degradable within a week
Green - Plastic
Green - Faux leather

You will present your visitors with one drop-down select box per attribute your product has (for example, one for size, and one for color...). The method works for an unlimited number of attributes, ie. two, three, whatever. The chosen options for the cart items attributes will be stored in a web cookie and submitted to Shopify's 'back-end' during the checkout process. This method uses JavaScript. With JavaScript disabled in the browser, your visitors will be unable to pick any attributes other than the default ones chosen for them. This method is a workaround. Jaded Pixel really should implement multiple attributes (most commonly, these are size and color), but they have chosen not to, so we have to make do. Read more →