SKU # for products on the collection page lists

Shopify Partner
3 0 0

Need to be hinted or shown how to add the SKU # for products on the collection page lists. I am using BlockShop Deli Theme.

Thanks, in advance.

Teejay

0 Likes
Shopify Expert
218 0 10

Hi

Does this help? 

https://help.shopify.com/themes/customization/products/features/show-sku-numbers

If you need help with a Shopify customisation, drop me an email on pipparose@etempa.co.uk
0 Likes
New Member
7 0 0

Pippa, your suggestion is great for adding the SKU to a single product listing, and I added it just this morning. I'd also like to have the SKU appear when viewing collections/all.

I've seen many requests for this but so far no instructions. I'll keep looking.

Thank you

0 Likes
Shopify Expert
218 0 10

Hi Kent

No problem - you just do exactly the same thing but instead of doing it on the products.liquid template or section, do it on the collection.liquid template or section. 

It might be the section of code you need in the collection.liquid page is referenced on a snippet instead. You may have to follow through the files. 

If you need help with a Shopify customisation, drop me an email on pipparose@etempa.co.uk
0 Likes
New Member
7 0 0

I found it in product-card-grid.liquid. Now, is there a way to have the SKU above the product name? Right now it shows the SKU immediately after the name. Even a bigger space would be better.

0 Likes
Shopify Expert
218 0 10

Hi Kent 

 

That's great - well done. So if you want it to appear before the product name, simply move the code you inserted to appear before you see the code product.name 

If you want to add more space, you'll need to work with css - are you familiar with it? You'll need to look for a file in your assets folder called styles.scss 

Then you need to give the container your SKU is in an identifier, such as 

<div class='sku_container'>{{ product.sku }}</div> 

Then in the styles.scss file, add the following: 

.sku_container
{
        padding: 20px; (You could also add padding-bottom: 20px; padding-top: 20px; depending on what you want) 
}

If you need help with a Shopify customisation, drop me an email on pipparose@etempa.co.uk
0 Likes
New Member
16 0 0

Hi

Just following up on this... 

I also would like to add the SKU to the collection page, but I'm struggling to find the correct part of the code to edit.

If someone could point me in the right direction that'd be great.

I've added the SKU to the individual product pages, that was straight forward enough! :)

Thanks

Steve

0 Likes