I’ve already custom metafield on the product and set it up as a product_reference,
so when I use
{{ product.metafields.my_fields.new_product}}
, it return stringgid://shopify/Product/7223085072540
as follow the document,https://shopify.dev/api/liquid/objects/metafield
{{ product.metafields.my_fields.new_product.value}} should return product object, but its not, it return noting
Can any body help about this issue ? 
I’ve been trying to diagnose the same issue for a couple hours now.
Hi there,
The thing is that the payload returned by this code appears to be an entire product object. Obviously, Liquid can’t convert an object into a valid HTML element to be displayed on the storefront. You may want to retrieve more details from that object and combine them with proper HTML code to make things work.
I tried using a code similar to yours on my dev store and got the exact same message:
So I decided to improve this code and managed to make it work, here is the result:
The initial version of my code (technically, it’s pretty much the same code you’ve shared, but with different namespace and key) looked like this:
{{ product.metafields.my_fields.product.value }}
and there is the updated version:
{% assign related_product = product.metafields.my_fields.product.value %}
{% if related_product != blank %}
<a href = "{{shop.url | append: "/products/" | append: related_product.handle }}">
<div class = "related-product">
<div class = "related-product-image" style="background-image:url('{{related_product.featured_image |img_url}}')"> </div>
<div class = "related-product-name">{{related_product.title}}</div>
<div class = "related-product-price">{{related_product.price | money}}</div>
</div>
</a>
{% endif %}
It’s just a quickly made draft code, but I think that it might be helpful. Don’t forget to change the namespace/key combination and feel free to use my code for creating a solution for your stores!