Materials and free samples

Furniture is bought by its materials. Atelier shows them as round chips with a large close-up, lets shoppers filter many materials by family, and lets them order free samples before they commit, with a sample box that never lets them order more than you can send.

What shoppers see

• Material chips in the buy box for every option named in Material option names: 44px circles showing each material's swatch. Hovering or focusing a chip previews it in the close-up; moving away brings back the selected one.
• Family tabs above the chips when an option has more values than Family tabs from (8 by default, on the Variant picker block) and they belong to two or more families: "Bouclé and wool · Leather · Linen and cotton", starting on the selected material's family. The legend counts the values ("Upholstery: Bouclé ivory, 14 options").
• The close-up under the chips: the selected material's swatch at 104px, its name, summary and origin, and the sample action. The image is the Material entry's swatch, else the option value's own swatch image, else its swatch color, else a stone square with the material's initial.
• The sample action, the close-up's last line:
  • "Order a free sample" (or "Order a sample · $5.00" when the sample variant has a price);
  • "Adding…" while it is added; the cart count updates and a screen-reader announcement says "Bouclé ivory sample added to your cart." The drawer doesn't open, because the shopper is still choosing;
  • "Sample in your cart" with View cart once it's there (or if it already was);
  • "You have 5 samples, the most we can send at once." when the cart holds the maximum.
• Order free samples, a link under the buy buttons, jumps to the close-up's sample action, or goes to your samples page when the product has no material close-up.
• Card chips: product cards show small chips from the first option whose values have Shopify swatches (Theme settings › Product cards › Show swatches). Set swatches on the option values in admin (each value's swatch color or image); Material entries alone don't add chips to cards.
• Material care: a Collapsible row with its content set to Material care shows the selected material's care notes, falling back to its own content when the material has none.

The Material library section

A stone band for your home page, a samples page, a collection or a product page. On the left: the kicker, heading ("Feel it before you choose it") and text, then the sample box: "Your sample box, 2 of 5", a slot for each sample the cart may hold (filled slots show the sample's swatch) and Review your samples, which opens the cart drawer. On the right: family tabs with counts, and a grid of material tiles, each with a square close-up, the name, the summary and Add sample (or "In your sample box").

The page.samples template that ships with every preset holds an intro, a Material library titled "Every material we work with" and a FAQ ("Sample questions"). Create a page called Samples, set its template to page.samples, choose its materials, and select it in Theme settings › Materials and samples › Samples page. The empty cart and the hero's "Order free samples" link point there.

Settings

Samples in the cart

Each sample is its own cart line, quantity 1, carrying two hidden properties: _sample and _sample_for (the product the shopper was looking at; empty from the library). In the cart drawer and on the cart page, samples are grouped after the other lines under Samples with "2 of 5, free" (or "2 of 5" when any sample costs something): a swatch, the material's name, "For the Arc lounge chair" or "From the material library", "Free" or the price, and a remove button. There is no quantity stepper, and if an app or the cart page raises a sample's quantity, the theme sets it back to 1. Your Sample note shows under the group.

A line counts as a sample when its product type is Sample or it carries the _sample property, so samples added by other means are counted too. When the cart holds only samples, checkout works as usual, with your shipping rates.

Untick Offer free material samples to turn samples off: the chips, family tabs and close-ups stay, and every sample action, the sample box, the links and the cart's samples group disappear.