Cards keep their design and wording. Where a card needs a product detail, its text names the product field, and the page fills in that product's value.
In a card's Card Data field, a product field's name between three colons on each side is a placeholder. When the page shows the card, it replaces the placeholder with that product's value for the field. Card Data without placeholders works exactly like the description does today.
Lens curve: :::sportrx.base_curve::: base.
Base curve: 6
Lens curve: 6 base.
The card is written once. Every product that has it shows its own number, and if a product's base curve is corrected, its card updates on its own.
Card wording below is illustrative.
The goggle never shows a half-filled “Lens curve: base.” card, because it was never given the card. Products without a base curve simply aren't assigned it.
It works the same for any field. If activities ever move into a card, Card Data reading “Perfect for: :::product.list_activities:::” would show each product's own list, e.g. “Perfect for: Biking, Running, Fishing”. We tested exactly this on the staging store.
Only the placeholder changes from product to product. So one card works for all base curve products as long as everything else on it is the same: the wording around the placeholder, the image, the pop-up and the colours. If any of that needs to differ for some products, duplicate the card, make the change, and give the copy to just those products.
Both cards still fill in each product's own base curve. The duplicate exists only because its wording and image are different. Make as few copies as the differences require, since each copy is one more card to keep up to date. Card names and wording here are illustrative.
| Situation | What the shopper sees |
|---|---|
| The card isn't on the product's card list | Not shown The card list always decides first. |
| The card is on the list and the product has the value | Shown With the product's value filled in. |
| The card is on the list, but the product's field is empty | Not shown A backup. Normally this can't happen, because a product without the detail isn't given the card. It covers a value being removed later. |
| The card has no placeholders, e.g. Free Shipping | Shown Whenever it's on the list, exactly as written. |
A question for you: when a card is on a product but that product's field is empty, should the card show general default wording instead of hiding? We've planned for it to hide, because these cards exist to give details specific to that product, and a general card without the product's own detail says little. If there are cards where general wording would still help, tell us which.
Together we define the set of cards used across many products, with their wording, images and placeholders.
Rules by product type, brand or a product detail. For example: every sunglass and eyeglass gets the base curve card, and only products with a base curve.
The import adds the right cards to every product at once, so nobody assigns cards by hand for the existing catalog.
After launch, the team adds or removes cards on any product freely, and can create one-off cards for unique situations alongside the standard set.
Edit the product's field, e.g. its base curve. Every card on that product that uses it updates.
Edit the card once. Every product that has it changes.
Create the card, with placeholders for any product details, then add it to the products it belongs on. That can be done in bulk from a spreadsheet.
Fill in its fields and give it its cards, typically the same standard cards as similar products.
Create a one-off card and add it to just the products that need it.
The Card Data field will carry short instructions right below it in the admin, on how to write a placeholder, with an example. Placeholders work the same in the card's pop-up.