Shopify setup

Add the configurator to your product template once, show it on the products that have one, and, on Collection and Partner, let shoppers add their exact build to the cart.

Allow your Shopify addresses

Send us both your store's own domain and its myshopify.com address. If the configurator shows in your store but not in the theme editor's preview, look under Websites in your console for the address the preview used, and send it to us.

Add it to the product template

1. Go to Online Store → Themes → Customize and open your product template.
2. Add a Custom Liquid block where the configurator should appear.
3. Paste this, with your key in place of ck_live_…:

{% if product.tags contains '3d' %}
  <script type="module" src="https://app.threedezy.com/sdk/latest/configkit.js"></script>
  <configkit-viewer license="ck_live_…" product="assets/{{ product.handle }}.json"></configkit-viewer>
{% endif %}

• The configurator shows only on products tagged 3d. Add that tag to each product that has one.
• {{ product.handle }} picks the right configurator for each product. We name each product's file after its Shopify handle (the end of its address, like arden-dining-table); your console's Products list shows each file's name.

If you'd rather place it product by product, paste the plain embed code from your console into a Custom Liquid block on a template made for that product.

Add to cart

On Collection and Partner, the main button can add the configured build to your cart instead of requesting a quote. Add cart="shopify" to the element; cart-label changes the button's text:

<configkit-viewer license="ck_live_…" product="assets/{{ product.handle }}.json"
  cart="shopify" cart-label="Add to cart"></configkit-viewer>

Request a quote stays available as a smaller button underneath. On Launch, or before your cart is set up, the main button stays Request quote.

How prices reach the cart

Shopify charges the prices of the products in the cart, so a build is added as:

• your product at its starting price, and
• a small add-on product for each upcharge in the build, such as "Walnut, +$400" or "Leather, +$650".

Every choice the shopper made is written on the cart line and the order, with a link that reopens the exact build, so your workshop sees what to make. It uses your store's own cart: there's no app to install.

What we need from you

1. Your products priced at their starting price, the build every product page opens on.
2. The add-on products, one per upcharge. We send you the list of names and prices, or create them ourselves with a staff account you give us.
3. Each add-on available on your Online Store sales channel and set to keep selling when out of stock (or with inventory not tracked); otherwise Shopify won't let it into the cart.
4. The add-ons left out of your collections and menus, so shoppers don't find them on their own.

We connect the options to the products and test the cart with you before you switch it on.

Check it

• Open a tagged product in your store (not only the theme editor preview).
• Build something with a few upcharges, add it to the cart, and check the total and the options on the cart line.
• Place a test order with a discount code or Shopify's test payments, and check the order in your admin.