Add SKU Above Product Title on Collection Pages - Minion Theme

[joshwp]

Hello. I am trying to figure out what code to add and where to add it to display the Item# (SKU) for my products on the collection pages. Ideally, this would be above the title. Any help is much appreciated. https://h0apyzb2s9zlhprr-72959885629.shopifypreview.com

[saurav9005]

Hi Joshwp

Online > Edit code and find collection-template liquid file and add below code above title

{% if product.sku %}
  

SKU: {{ product.sku }}

{% endif %}

Hope this will help.

[joshwp]

These are the code files that are available. Do you know which one I would add that code in?

[saurav9005]

Hi,

Naming looks like similar - try to find out which template this theme is using. for that we can always go to the product > collection and open any collection and scroll down to online store - theme template (see the screenshot). That will tell you what template you are using for collection list. And after that => go to that template file and

1. search for class called “product-card__heading” - that is the product title classname. After finding that - add sku code above it and style it in your way.

[joshwp]

That code didn’t work. I am able to display “Item#” under each product but using {{ product.sku }} doesn’t display the product. Do I need to add more code for it to pull in the sku from somewhere else? Here is what the code looks like with my addition on line 157.

{%- comment -%}
    Renders a product card

    Accepts:
	- product_card_product: {Object} Product Liquid object (optional)
    - settings_image_ratio: {String} Size of the product image card. Values are "auto", "portrait", "landscape", "square" and "round". Default is "auto" (optional)
    - show_button_quickview: {Boolean} Show the product button "Quick view". Default: false
    - show_badge_sold_out: {Boolean} Show the product badge "Sold Out". Default: true
    - show_badge_on_sale: {Boolean} Show the product badge "On Sale". Default: true
	- show_badge_feature: {Boolean} Show the product badge "Feature". Default: true
    - show_secondary_image: {Boolean} Show the secondary image on hover. Default: false (optional)
    - show_vendor: {Boolean} Show the product vendor. Default: false
    - show_type: {Boolean} Show the product type. Default: false
    - product_name_size: {String} Size of the product name. Values are "normal" and "body2". Default is "body2" (optional)
    - hover_underline: {Boolean} The product name hover underline. Default: false (optional)
    - truncate_product_name: {Boolean} Truncate the product name. Value is 48. Default: false (optional)
    - show_rating: {Boolean} Show the product rating. Default: false
    - show_price: {Boolean} Show the product price. Default: true
    - button_type_product: {String} Size of the product image card. Values are "hide", "show", "show only text" and "show only icon". Default is "show"
	- page_is_wide: {Boolean} Page width for image size. Default: false
	- section_id: {String} The ID of the section that contains this card.
    - hide_product_card_swatches: {Boolean} Show product card swatches. Default: false
    - disable_image_zoom: {Boolean} Show product card swatches. Default: false

    Usage:
    {% render 'product-card', show_vendor: section.settings.show_vendor %}
{%- endcomment -%}

{%- liquid
if settings_image_ratio != 'auto'
capture image_ratio
if settings_image_ratio == '1, round-image'
  echo settings_image_ratio | split: ',' | first
else
  echo settings_image_ratio
endif
endcapture
else
  assign image_ratio = product_card_product.featured_media.aspect_ratio
  if product_card_product.featured_media.aspect_ratio == nil
  assign image_ratio = 1
  endif
endif
-%}

{%- capture product_card_swatches -%}
{%- unless hide_product_card_swatches  -%}
{%- render "product-card-swatches" product_card_product:product_card_product, image_ratio:image_ratio -%}
{%- endunless -%}
{%- endcapture -%}

{%- assign last_characters = 'general.abbreviation_of_text_in_a_section.last_characters' | t -%}

  {%- capture badges -%}
  {%- if product_card_product.available == false and show_badge_sold_out -%}
  {{ 'products.product.sold_out' | t }}
  {%- elsif product_card_product.compare_at_price > product_card_product.price and product_card_product.available and show_badge_on_sale -%}
  {{ 'products.product.on_sale' | t }}
  {%- endif -%}
  {%- if product_card_product.metafields.softali.featured_badge != blank and show_badge_feature -%}
  {{ product_card_product.metafields.softali.featured_badge }}
  {%- endif -%}
  {%- endcapture -%}
  
{{- badges -}}

  
    {%- assign image = product_card_product.featured_media -%}
    {%- if image != blank -%}
    
      
  
      {%- if product_card_product.media[1] != nil and show_secondary_image -%}
      {% assign image = product_card_product.media[1] %}
      
      {%- endif -%}    
    
    {%- else -%}
    
      
        {%- if truncate_product_name -%}
        {{ product_card_product.title | escape | truncate: 48,last_characters }}
        {%- else -%}
        {{ product_card_product.title | escape }}
        {%- endif -%}
      
      
      
    {%- endif -%}

    {%- if show_button_quickview -%}
      
    {%- endif -%}
  

  
  
    {{ product_card_swatches }}
    
    {%- if show_vendor and product_card_product.vendor != blank -%}
    

      

{{ product_card_product.vendor }}

    

    {%- endif -%}
    {%- if show_type and product_card_product.type != blank -%}
    
      

{{ product_card_product.type }}

    

    {%- endif -%}
Item# {{ product.sku }}

    
    {%- if product_card_product.featured_media != blank -%}
    
      
        {%- if truncate_product_name -%}
        {{ product_card_product.title | escape | truncate: 48,last_characters }}
        {%- else -%}
        {{ product_card_product.title | escape }}
        {%- endif -%}
      
    

    {%- endif -%}

    {%- if show_rating and product_card_product.metafields.reviews.rating.value != blank -%}
    {%- liquid
    assign rating_decimal = 0 
    assign decimal = product_card_product.metafields.reviews.rating.value.rating | modulo: 1 
    if decimal >= 0.3 and decimal <= 0.7
    assign rating_decimal = 0.5
    elsif decimal > 0.7
    assign rating_decimal = 1
    endif 
    -%}
    
      

        
      

      

        {{ product_card_product.metafields.reviews.rating.value }} / {{ product_card_product.metafields.reviews.rating.value.scale_max }}
      

      

        ({{ product_card_product.metafields.reviews.rating_count }})
        {{ "accessibility.total_reviews" | t: count: product_card_product.metafields.reviews.rating_count }}
      

    

    {%- endif -%}

    {%- if show_price -%}
    {%- render 'price', product: product_card_product -%}
    {%- endif -%}
    {%- if button_type_product != "hide" -%}

    {%- if product_card_product.variants.size > 1 and product_card_product.available -%}

    
    
    {%- else -%}
    
    
    
    {%- endif -%}
    {%- endif -%}

    {%- assign buy_button_quickview = false -%}
    {%- if product_card_product.variants.size > 1 and product_card_product.available -%}
    {%- assign buy_button_quickview = true -%}
    {%- endif -%}
    {%- if buy_button_quickview or show_button_quickview -%}
    
    {%- endif -%}    
  

[saurav9005]

Find below div

  
    {%- if truncate_product_name -%}
    {{ product_card_product.title | escape | truncate: 48,last_characters }}
    {%- else -%}
    {{ product_card_product.title | escape }}
    {%- endif -%}
  

and after adding sku

Item# {{ product_card_product.variants[0].sku }}

  
    {%- if truncate_product_name -%}
    {{ product_card_product.title | escape | truncate: 48,last_characters }}
    {%- else -%}
    {{ product_card_product.title | escape }}
    {%- endif -%}
  

you have to add

Item# {{ product_card_product.variants[0].sku }}

Hope this is helpful

[joshwp]

This worked perfectly! Thank you for your help!

[iffatgull]

Hey, please can you tell me where should I add this code?

[joshwp]

@iffatgull You will want to add it in product-card.liquid which can be found in the snippets folder. Here is what it looks like on my site.