Variant.id not updating when use changes selection

Technical Q&A

Topic summary

A developer is experiencing an issue where variant metafields (package size and weight) don’t update dynamically when users select different product variants on a Shopify product page.

Current Behavior:

  • The variant ID changes in the URL when a new variant is selected
  • The displayed metafields remain static and don’t reflect the new selection
  • A page refresh is required to see updated variant information

Technical Context:

  • Using Liquid code to display variant.metafields.custom.package_weight and variant.metafields.custom.package_size
  • The code loops through product variants and checks if the variant matches the selected/first available variant

Issue:
The Liquid template renders server-side and doesn’t automatically update when JavaScript changes the variant selection client-side. The developer is seeking a method or API call to dynamically update the variant.id and associated metafields without requiring a full page refresh.

Summarized with AI on November 25. AI used: claude-sonnet-4-5-20250929.
1

We are displaying product variant meta fields for package size and weight, using liquid code on the product page.

However when the use chooses a different variant the variant.id does not change, though it does on the url. If we refresh the page the variant.id does get updated. Is there a call I can make to update the variant.id??

liquid code is

{% for variant in product.variants %}
{% if product.selected_or_first_available_variant.id == variant.id %}
{% assign current = variant.id %}

ID is {{current}}

Package Weight {{ variant.metafields.custom.package_weight }}

Package Dimensions {{ variant.metafields.custom.package_size }}

{% endif %} {% endfor %}

can anyone help