Show SKU Under Product Title In WooCommerce

By default, the WooCommerce single product page shows the SKU in the product meta area below the Add to cart button. This snippet also prints it at the top of the product summary, just below the title, and for a variable product it lists the SKU of every variation.

Add it to your child theme’s functions.php file.

// ******************* SHOW SKU ****************** //
add_action( 'woocommerce_single_product_summary', 'hoop_show_sku', 5 );
function hoop_show_sku(){
    global $product;

    if ( $product->is_type( 'variable' ) ) {
      $available_variations = $product->get_available_variations();
      for ($i = 0; $i <  count($available_variations); $i++ ) {    
          echo '<div class="var-sku"><p>SKU: ' . ($available_variations[$i]['sku']) . '</p></div>';
      }
    } else {
      echo 'SKU: ' . $product->get_sku();
    }
}

How it works

• woocommerce_single_product_summary is the hook that builds the summary column. WooCommerce prints the product title on it at priority 5, the same priority used here. If the SKU shows up above the title on your theme, change 5 to 6.
• For a variable product, get_available_variations() returns data for each variation, and the loop prints one div.var-sku per variation. It shows all of them at once, not only the variation the customer selects. To output more than the SKU for each one, see looping through every variation of a product.
• For other product types, get_sku() prints the SKU as plain text. With no wrapper element it is hard to style, so you may want to put it in a tag with a class, as the variable version does.
• If a product has no SKU, the label SKU: still appears with nothing after it.

Because the default meta area still shows the SKU, you may now see it twice on the page. It’s also good practice to escape values such as the SKU with esc_html() before you echo them.

If your product pages need details such as the SKU placed exactly where your design puts them, see my WooCommerce development services.

Related articles

• category names and descriptions on the single product page: another addition to the product summary
• removing the Additional information tab: a related single product page cleanup