> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kwebby.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Spec rows

> List your specs once, in Theme settings, and Kelvin shows them on product cards, the product page, quick view, compare tables and the PC Builder.

Tech shoppers choose on numbers: battery life, wattage, refresh rate. Kelvin keeps those numbers in product metafields in the `specs` namespace, and reads one list, **Theme settings → Product cards → Spec rows**, to know which specs to show, in which order and under which label.

![A product card with its badge, spec rows and stock line](https://mintcdn.com/kwebby/QKNMzt7KPy_yk6ai/images/kelvin/guide-card-specs.webp?fit=max\&auto=format\&n=QKNMzt7KPy_yk6ai\&q=85\&s=b752f892edc616d9790258a73abd3e36)

A card on the demo: the Best seller badge (1), four spec rows (2) and the stock line (3)

**1. Write the list.** In the theme editor open **Theme settings → Product cards** and edit **Spec rows**. Write one spec per line: the metafield key, a bar, then the label shoppers see, for example `battery_life | Battery`. The key is the part after `specs.` in the metafield's namespace and key. The order of the lines is the order specs appear everywhere. A line without a label shows the key itself, and empty lines are skipped.

Kelvin ships with this list, a good start for a tech store:

```text theme={null}
battery_life | Battery
noise_cancelling | Noise cancelling
connectivity | Connection
layout | Layout
switches | Switches
polling_rate | Polling rate
power_output | Power
ports | Ports
socket | Socket
cores | Cores
vram | Video memory
form_factor | Form factor
capacity | Capacity
wattage | Wattage
screen_size | Screen
refresh_rate | Refresh rate
water_resistance | Water resistance
weight | Weight
```

| Key | Label | Typical products | Example value |
| - | - | - | - |
| `battery_life` | Battery | Headphones, earbuds, speakers, mice | 40 h |
| `noise_cancelling` | Noise cancelling | Headphones, earbuds | Adaptive |
| `connectivity` | Connection | Audio, keyboards, mice | Bluetooth 5.3, USB-C |
| `layout` | Layout | Keyboards | 75% |
| `switches` | Switches | Keyboards | Linear, hot-swap |
| `polling_rate` | Polling rate | Mice, keyboards | 8000 Hz |
| `power_output` | Power | Chargers, power banks | 65 W |
| `ports` | Ports | Chargers, docks | 2 USB-C, 1 USB-A |
| `socket` | Socket | Processors, motherboards | AM5 |
| `cores` | Cores | Processors | 8 |
| `vram` | Video memory | Graphics cards | 12 GB GDDR6 |
| `form_factor` | Form factor | Motherboards | Micro-ATX |
| `capacity` | Capacity | Storage, memory, power banks | 2 TB |
| `wattage` | Wattage | Power supplies | 850 W |
| `screen_size` | Screen | Monitors | 27 in |
| `refresh_rate` | Refresh rate | Monitors | 165 Hz |
| `water_resistance` | Water resistance | Speakers, earbuds, watches | IP67 |
| `weight` | Weight | Anything carried | 250 g |

Keep the keys you use, delete the ones you never will, and add your own lines in the same form. Each kind of product only fills its own keys, so a pair of headphones and a graphics card each show their own specs from the same list.

**2. Create the metafield definitions.** In Shopify admin open **Settings → Custom data → Products** and choose **Add definition** for each key:

* **Name**: the label, for example Battery.
* **Namespace and key**: `specs.battery_life`, exactly as in the list (lowercase, with underscores).
* **Type**: **Single line text**, one value. **List of single line text** works too; Kelvin joins the values with commas.

Save, then repeat for every key you use.

**3. Fill in the values.** Open a product in the admin and type its values in the **Metafields** section near the bottom of the page, or fill many products at once in the bulk editor. Write the unit in the value (`40 h`, `65 W`, `8000 Hz`) and use the same unit and spelling on every product: the compare page reads the first number in a value to mark the best one, and filters list every distinct spelling as its own choice.

**4. Choose how many rows a card shows.** **Spec rows on cards**, in the same group, takes 0 to 6 (4 on install). A card shows the first specs of the list that the product has, skipping the ones it lacks. Under 750 px cards show the first two, so put the spec that matters most for each kind of product first among its keys. 0 shows no spec rows on cards.

> [!TIP]
>
> Values print exactly as typed and long ones wrap onto a second line on cards, so keep them short.

**Where else the list is used.**

* **Product page.** The **Key specs** block of [Product information](https://docs.kwebby.com/kelvin/sections/product-information.md) shows the first specs the product has (**Specs to show**, 2 to 8, 4 on install). The **Below: specifications** block shows all of them in a table, with Brand (the vendor), Model (the SKU) and the unit price.
* **Quick view** shows the first six, and the **Featured product** section has its own Key specs block.
* **Compare page and the home page's [Compare picker](https://docs.kwebby.com/kelvin/sections/compare-picker.md).** Each spec that any compared product has becomes a row. The compare section's Higher is better and Lower is better settings list the keys whose best value is marked Best.
* **PC Builder.** The parts lists show these specs, and `socket` and `form_factor` also feed the builder's compatibility checks on processors and motherboards. See [PC Builder](https://docs.kwebby.com/kelvin/guides/pc-builder.md).
* **Filters.** Collection and search pages show the filters you add in the Search & Discovery app, and any of these metafields can be one. See [Filters with Search & Discovery](https://docs.kwebby.com/kelvin/guides/search-and-discovery-filters.md).

**Extra specs for a few products.** For details only some products have, add a **Multi-line text** definition with the namespace and key `specs.specifications`, and type one `Label: value` per line. These lines show only in the product page's specifications table, after the listed specs.

**When a product has none.** Nothing is drawn: no empty box and no dashes on its card, no Key specs, and no specifications table unless `specs.specifications` has lines. On the compare page the product's cell in a spec row shows a dash, read as Not listed by screen readers, and a row only appears when at least one compared product has that spec.

## In the theme editor

![Product card settings](https://mintcdn.com/kwebby/tbWCv70mkhaUy_7w/images/kelvin/settings-product-cards.webp?fit=max\&auto=format\&n=tbWCv70mkhaUy_7w\&q=85\&s=f19453c494fa5a0bfa0e7fb443c749fc)

Spec rows and how many show on cards: 1 Theme settings · 2 Product cards


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.