Hello everyone
I use the Trade template and I would like the sku to appear on the product cards beyond the travel and the price
where do I embed it?
Navigate to Online Store > Themes.
Click Actions next to your active theme (Trade template), then select Edit code.
Locate the Product Card Template:
Open the Snippets folder and find the snippet responsible for rendering product cards. This is often named something like product-card.liquid, product-grid-item.liquid, or similar.
Alternatively, the product card code might be in the Sections folder under a file like collection-template.liquid or collection-grid.liquid.
Locate the section where the product’s title and price are displayed. It typically includes a product object and lines like {{ product.title }} or {{ product.price | money }}.
Add the SKU just below or alongside these elements using:
<p class="product-sku">SKU: {{ product.sku }}</p>
If product.sku doesn’t work, you may need to loop through the product variants to retrieve the SKU:
<p class="product-sku">
SKU: {{ product.variants.first.sku }}
</p>
Open the Assets folder and edit your CSS/SCSS file (e.g., theme.css.liquid).
Add a style for the SKU to make it visually consistent:
.product-sku {
font-size: 14px;
color: #555;
}
Try and let me know if it works
1 Like
SKU doesn’t exist against the product object, only against the variant. I’d advise again doing this as it won’t work when you have multiple variants.
You can use product.selected_or_first_available_variant to get by the variant issue.
But the problem here is you’ll be showing just that first variant SKU only, it can be quite misleadeing then.
