Display sku in single product page – with variations

Hello @wordpressuser18 ,

I understand your request and it will take a bit of a trick to make it work as expected. You can understand that the SKU information needs to be updated as soon as the variation selection is made. This will require the use of Javascript/jQuery along with a PHP code that you have used.

We can rather re-use one of the default WooCommerce code that comes from the product meta.php file.

So, this is how you can use your code now –

add_action( 'woocommerce_single_product_summary', 'dev_designs_show_sku', 5 );

function dev_designs_show_sku(){
	global $product;
	?>

	<div class="product_meta custom">

		<?php if ( wc_product_sku_enabled() && ( $product->get_sku() || $product->is_type( 'variable' ) ) ) : ?>

			<span class="sku_wrapper"><?php esc_html_e( 'SKU:', 'woocommerce' ); ?> <span class="sku"><?php echo ( $sku = $product->get_sku() ) ? $sku : esc_html__( 'N/A', 'woocommerce' ); ?></span></span>
		<?php endif; ?>

	</div>
 <?php
}

You can now target this custom product meta class using .product_meta.custom and change the style via CSS.

I hope this information helps.

Thank you ??

Hi @rur165,

We’ve not heard back from you in a while, so I’m marking this thread as resolved. Hopefully, the above info was useful and you were able to find a solution to your problem!

If you have further questions, please feel free to open a new topic.

Thanks.