Product setup
Casella reads product data from metafields. Fill them in once for each product.
Create the metafields
Section titled “Create the metafields”In Settings, Custom data, Products, add these definitions. The namespace and key must match exactly.
| Name | Namespace and key | Type |
|---|---|---|
| Width | custom.width | Dimension |
| Depth | custom.depth | Dimension |
| Height | custom.height | Dimension |
| Seat height | custom.seat_height | Dimension |
| Delivery | custom.delivery | Single line text |
| Fits door override | custom.fits_door_override | True or false (optional) |
| Cut-out | custom.cutout | File, image (optional) |
| Drawing | custom.drawing | Single line text (optional) |
| Lead time | custom.lead_time | Single line text (optional) |
| Pre-order | custom.preorder | True or false (optional) |
| Discontinued | custom.discontinued | True or false (optional) |
| Restock date | custom.restock_date | Date (optional) |
The last four can also be created under Settings, Custom data, Variants. A variant value wins over the product value.
Enter dimensions in inches or centimeters. The theme shows both. An empty metafield hides that part of the page.
Measurements
Section titled “Measurements”Width, depth and height show as “W 84 · D 38 · H 29 in” on cards, on the product page and on the cart page. Seat height shows on the product page. The dimension drawing needs a width.
The dimension drawing
Section titled “The dimension drawing”The Dimensions block draws the piece from its measurements. It does not use the product photos.
- Best with a cut-out in the Cut-out metafield. The drawing uses its outline.
- Works with the measurements alone. The theme draws an outline for the kind of piece (sofa, armchair, chair, stool, bench, table, storage, bed, lamp, pendant, sconce or rug). It reads the kind from the product type, then the title. For other products it draws a box. To choose the kind yourself, add a single line text metafield
custom.drawingwith one of those words, or “box”. - Without a width, no drawing shows.
The Cut-out metafield needs a PNG with a transparent background. A JPG is ignored, and a PNG with a background draws as a solid block. To make a cut-out, open the image in the Shopify admin, choose Edit, then Remove background.
The door note
Section titled “The door note”Casella tells shoppers whether a piece fits through a door. Set the door width under Theme settings, Measurements (30 in by default). The note needs width, depth and height, and shows only for close calls. The Fits door override metafield forces the note on a product: true says it fits, false says it needs a wider door.
Delivery
Section titled “Delivery”Set the Delivery metafield to a word such as “White-glove freight” or “Parcel”.
- A value with “freight” or “white” counts as freight.
- Anything else counts as a parcel.
The delivery type sets the arrival dates in the cart and on the product page. In the cart, a true custom.ships_by_parcel metafield also counts as a parcel when Delivery is empty.
Availability
Section titled “Availability”Every product shows one short status line directly above the Add to cart button, with a small drawn mark. The line is always there, so the page does not shift when a shopper changes a colour or fabric. Timing never goes in the status line; it goes in the Delivery row.
| Status line | When | Button | Delivery row |
|---|---|---|---|
| In stock | Otherwise, including stock Shopify does not track | Add to cart | The arrival dates |
| Only 3 left | Shopify tracks the variant, stops selling at zero, and the count is at or under the Stock threshold (Theme settings, Stock) | Add to cart | The arrival dates |
| Made to order | custom.lead_time is set, such as 8–10 weeks |
Add to cart | Ships in 8–10 weeks |
| Pre-order | custom.preorder is true, or the variant needs a pre-order selling plan, or Shopify keeps selling the variant at zero (a backorder) |
Pre-order | Ships from Jan 15 (the restock date), else “Later than usual” or your Backorder delivery text |
| Sold out | The variant is not available | Sold out (disabled) | Back around Dec 10 (the restock date), else a dash |
| No longer made | Sold out and custom.discontinued is true |
Sold out (disabled) | A dash |
“Only 3 left” names the variant (“Only 3 left in Walnut”) when the name is short. A restock date in the past is ignored. A variant that is both a pre-order and low in stock reads Pre-order.
The same words appear everywhere:
- Swatches. A sold-out value is struck through. A pre-order value carries a small clock. The chosen value’s name is followed by the state, such as “Oxblood leather · Sold out”.
- Buy it now. Shopify’s accelerated checkout button is put away, in place, while the chosen variant cannot be bought now or needs a selling plan.
- Product cards. A small chip on the photo: Sold out, Pre-order, Made to order or Only 3 left. A piece in stock shows nothing. Switch it off with “Show availability on product cards”.
- Cart. A pre-order line shows “Pre-order”, and its delivery line gives the timing, such as “White-glove freight · Ships from Jan 15”.
Selling plans: a plan that charges less than the full price at checkout (a deposit) counts as a pre-order. A subscription plan that charges in full does not.
Reviews and ratings
Section titled “Reviews and ratings”Casella reads two metafields that review apps such as Judge.me, Okendo and Shopify Product Reviews fill in: reviews.rating and reviews.rating_count. Review stars then show on product cards and in the Rating block on the product page. Ratings show out of 5, whatever scale the app uses. A product without a rating shows nothing. Turn the stars off on cards under Theme settings, Product cards.
Width bands for filtering
Section titled “Width bands for filtering”To filter by width, create a text metafield with the key width_band. Give each product a band, such as “Under 60 in”, “60–80 in” or “Over 80 in”. Add it as a filter in Search & Discovery and label it Width (see the filters guide). The filter then draws as a ruler.
Badges
Section titled “Badges”Add a tag that starts with badge:. For example, badge:New shows “New”.
- A card shows two badges at most.
- “Sold out” and “Sale” come first. “Sold out” moves to the availability chip at the photo’s foot while “Show availability on product cards” is on.
- Turn badges off under Theme settings, Product cards.
Swatches
Section titled “Swatches”Use Shopify’s native swatches on a product option such as Color or Fabric.
- In Settings, Metaobjects, edit the Color category (or the category for your option) and add a color or an image for each value.
- Link the option to the category in the product.
An image swatch shows the fabric photo in the dot. On a product card, choosing a swatch changes the card photo to that variant’s image. Assign each variant its featured image in the product. Cards show up to four dots.
Variant photos
Section titled “Variant photos”Give each variant a featured image. The gallery and the quick-add panel show that image first. Use alt text that names the option, such as “Arlo sofa in Fog linen”. Quick add then leaves out pictures of other colors.
Quantity rules
Section titled “Quantity rules”Set minimum, maximum and increment per variant in Shopify (B2B or Markets quantity rules). The stepper follows them.