Variant Metafield reference is Giving Invalid Error

No, you can’t use variant properties as dynamic sources.

I wonder how you were able to even add that reference though.

To do what you want there is a bunch of app, one of them is “Variant descriptions”

Alternatively for Dawn family themes, you can use “Custom Liquid” block/section and use this code:

{% # id must be unique %}
<variant-data class="rte" id="realism-{{section.id}}">
 {{ product.selected_or_first_available_variant.metafields.custom.realism }}
</variant-data>

<script>
  if (!window.defineVariantData ) {
    window.defineVariantData = () => {
      if (!customElements.get('variant-data')) {
        class VariantData extends HTMLElement {
          constructor() { super(); }
          connectedCallback(){
            subscribe(PUB_SUB_EVENTS.variantChange, ({data}) => {
              const newContent = data.html.getElementById(this.id)?.innerHTML;
              if (newContent) this.innerHTML = newContent;
            });
          }
        }
        customElements.define('variant-data', VariantData )
      };
    }
  
    if (document.readyState == "complete") defineVariantData()
    else window.addEventListener('load', defineVariantData );
  }
</script>

Demo – Look at the “Available at 14 Lyndon St” here, above the title

Similar solution for Horizon family themes: Please help me with this variant metafield code fix - #2 by tim_1


if my post is helpful, please like it ♡ and mark as a solution -- this will help others find it