Dawn 8.0 Variants and Metafields & Variants

Store Design
1

Hi,

I have a product with several size variants.

800 x 800 x 375

800 x 800 x 500

and more

I would like to create a text line on the product page so that when a customer selects a size combination then the Volume is shown.

So the customer selects the 800x800x375 option and the Volume field shows 240L.

I have added a metafield variant called volume. (variants.metafields.custom.volume).

I have entered the metafield value into each product variant so that each variation has its own “volume” value.

My problems is I have no idea how to get it to show on the product page.

I added a text block and called it “Volume” and tried to insert the dynamic source. But it only shows the Product metafields. I don’t know how to get it to show the Variant Metafield for me to select it.

Scrolling through lots and lots of threads, I’m not sure if I’m supposed to put the variant in the custom liquid box. But if I do nothing happens.

I would appreciate any help as I’m going round in circles.

thanks,

Josie

1 Like
2

hello there

To display the value of a variant metafield on the product page in Shopify, you can use Liquid code to retrieve the metafield value for the currently selected variant and display it on the page.

Here’s an example of how to do this:

  1. Add the metafield to your product variants. You can do this by going to the product page in the Shopify admin, clicking on the “Edit” button for the product, and then scrolling down to the “Variants” section. From there, you can click on the “Edit” button for each variant, and then add the volume metafield with the appropriate value.
  2. Retrieve the metafield value in the product template. You can do this by adding the following code to the product.liquid template file:
{% assign current_variant = product.selected_or_first_available_variant %}
{% assign volume = current_variant.metafields.custom.volume %}

{% if volume %}
  

Volume: {{ volume }}

{% endif %}

This code retrieves the currently selected variant using the product.selected_or_first_available_variant variable, and then assigns the value of the volume metafield to the volume variable. It then checks if the volume variable has a value, and if it does, it displays the volume value on the page.

3

Hi,

this is exactly what I wanted - thank you. I just didn’t know the correct liquid coding.

I have two further questions. (sorry!)

  1. When I created the variant metafield called “Volume”, I made the content type “Volume”. This is purely so I could add the value in with L by it.

On the page, it displayed this as

Volume : {“value”:500.00,“unit”:“l”}

and of course I was just expecting

Volume: 500L

I created a new variant metafield and made the type “integer” and it worked as expected. I simply changed the text to be
Volume in Litres:

and the value was displayed as expected:

Volume in Litres: 500

It’s not a big deal, as I can use an integer but just curious as to how to remove the value and unit fields.

  1. How do I get it to “refresh” the page each time a different variant is selected so that it picks up the right “volume result”. I’ve seen various posts regarding this with different recommendations.

Any thoughts on the best way to do this?

Otherwise, thank you so much - it is just what I wanted. :slightly_smiling_face: