Set up your product data

Xenon shows details that parts shoppers look for: part numbers, condition, where the stock comes from, dispatch times, specifications and compatible models. Most come from data your products already have, such as SKUs and tags. The rest come from metafields, which you add once and then fill in per product.

Part numbers

Where they show: product cards, the product page, the cart and live search results.

Where they come from: the variant's SKU, or its barcode when the SKU is empty. To use a metafield instead:

1. Set Theme settings > Part numbers > Part number source to Metafield.
2. Enter the metafield's namespace and key in Part number metafield (custom.part_number by default).

Part numbers are printed exactly as you store them.

Showing and hiding them: Theme settings > Product cards > Show part number controls cards, the cart and live search. On the product page, add or remove the Part number block.

Search: shoppers can find a product by its SKU or barcode, and by the first few characters of it. "C41N" finds "C41N1901".

Condition

A badge on the product image says whether a product is used, refurbished or a demo unit.

From tags (the default). List the tags that mean a condition in Theme settings > Product condition > Condition tags, separated by commas. The default is Demo, Refurbished, Used.

• A product shows the first listed tag that it carries.
• The badge is spelled the way you write it in the setting.
• Matching ignores capital letters but needs the whole tag. The tag used matches "Used", but used laptop doesn't. Add Used laptop to the list if you use it.

From a metafield. Set Condition source to Metafield, and enter the metafield in Condition metafield (custom.condition by default). Use a Single line text metafield. The badge shows its value.

New products show no badge while Hide badge for new products is on.

Sale badge. A product without a condition badge shows a sale badge when its price is below its compare-at price.

Stock source

Every product shows one of three stock labels:

Supplier stock is for products you order from a supplier when a shopper buys them. Tag those products with a tag listed in Theme settings > Stock source > Supplier stock tags (supplier-stock by default).

Wording. Change the labels in In stock label, Supplier stock label and Unavailable label. Leave them blank to use the theme's wording, which is translated with your store's languages.

Colors. The labels use the status colors in Theme settings > Colors. The words always show, so color is never the only signal.

Dispatch times

The product page can show how soon an order ships, for example "Ships within 1 to 4 business days". Set the times in Theme settings > Stock source:

To give one product its own time, fill in its dispatch time metafield (custom.dispatch_time, Single line text). It replaces the times above. Leave everything blank to hide dispatch times.

Unavailable products

When Theme settings > Stock source > Request page is set, sold-out products invite shoppers to ask about them:

• product cards show Ask about this part
• the product page shows a panel with a link

Both open your request page with the product and its part number filled in. Without a request page, sold-out products show Sold out. See Contact page and part requests.

Specifications

The Specifications block shows a product's specifications as a table of labels and values. They come from a metafield, custom.specifications by default. You can fill it in three ways:

• Multi-line text, one specification per line, as Label: value:

  Voltage: 15.4V
  Capacity: 4000mAh
  Cells: 4
  

• JSON, as an object: {"Voltage": "15.4V", "Capacity": "4000mAh"}

• Single line text, with List of values chosen, one Label: value per entry

Lines without a colon are skipped. Products with the metafield empty don't show the block.

Compatibility

The Compatibility block lists the models a part fits, and other part numbers it replaces.

• Models: the custom.compatible_models metafield. Use Single line text with List of values chosen, or Multi-line text with models separated by commas or new lines.
• Part numbers: the custom.alternate_part_numbers metafield, in the same formats. They show on one line.

Lists longer than 12 models get a Find your model field that filters as shoppers type. It ignores capitals, spaces, dashes, slashes and dots, so "ux481 fa" finds "UX481FA-BM020R". Change the length in the block's Show a model filter for lists longer than setting.

Buying guides

The Callout block on the product page can link to up to three blog posts, such as a guide to checking compatibility. List them in the product's custom.related_guides metafield: type Article, with List of values chosen.

Products in blog posts

A blog post can show products below it, for example the parts a repair guide uses. List them in the post's custom.related_products metafield: type Product, with List of values chosen.

Create the metafields

Create each metafield once, as a definition. Then it appears on every product (or blog post) for you to fill in.

1. In your Shopify admin, go to Settings > Metafields and metaobjects.
2. Choose Products (or Blog posts), then Add definition.
3. Enter a name. Set the namespace and key exactly as in the table, for example custom.specifications.
4. Click Select type and choose the type. For a list, click One value, then List of values.
5. Click Save.

Already using metafields with other keys? Point Xenon at them instead: each block or theme setting that reads a metafield has a setting for its namespace and key.

Variants, swatches and images

• Options show as buttons or a dropdown (Product information > Variant picker > Style).
• Swatches: options set up with swatches in Shopify show colors or images instead of words, while Show swatches is on in the Variant picker block.
• Variant images: assign an image to each variant in the product's admin page. When a shopper chooses that variant, its image comes to the front.
• Quantity rules: a variant's minimum, maximum and increment (from Shopify's B2B quantity rules) are followed by the quantity selector, and shown under it.
• Unit prices, when a product has them, show with the price on cards, the product page and in the cart.

Filters for parts

Shoppers can filter by any of this data. In the Search and Discovery app, add filters such as:

• Condition: a tag filter, or a metafield filter on custom.condition
• Brand: the vendor filter
• Availability and Price