Display Product Variation SKU When Selected from Dropdown

I want to display the SKU of the selected Variation of a product on the product page.

I’m using a WooCommerce Single Layout in Cornerstone and have the Add to Cart form included in the template.

When someone selects the Variation from the drop down menu produced by the Add to Cart form, I need the SKU of the Variation selected in the dropdown menu to appear somewhere on the product page, preferably near the add to cart button.

I’ve already found out how to add the SKU of the Parent Product on the product page, but can’t find a solution for displaying the Variation SKU.

Here’s a product page with this issue (PSW-MAG is the parent SKU, the Variation SKUs start off with that SKU but are much longer):

Hi @jgille07,

Thanks for reaching out.
It is not clear what exactly you are trying to do here. You can’t show the SKU inside the Add to Cart Form element as that element has the Dropdown and Button as a single element and can’t be modified. If you still want that, I would suggest you hire a developer who can assist you to do the customization.

Thanks

I’m simply asking if there’s a way to display the SKU of the product variation that’s selected in the dropdown menu of the Add to Cart form.
So there are products and then variations of that products based on attributes, which appear in a drop down menu as part of the Add to Cart form.
Each variation of a product has a separate SKU in WooCommerce.
I want to show the SKU of the variation once it’s selected in the drop down menu.

Hello @jgille07,

In your custom WC Single layout, insert a Text element and then use this HTML code:

<span class="product_meta">
 <span class="sku_wrapper">SKU: 
  <span class="sku" data-o_content="{{dc:woocommerce:product_sku}}">{{dc:woocommerce:product_sku}}</span>
 </span>
</span>

This will display the SKU and as soon as you select any of the product variations, the SKU will change as well.

Kindly let us know how it goes.

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.