Dawn Theme - Show Product Metafields in the Collection Grids

The goal is to display product metafields on the collection pages, yet calling the following lines of code inside card-product.liquid returns null/blank:

{% if product.metafields.custom.width %}
  <p>{{ product.metafields.custom.width }}</p>
{% endif %}
{{ product.metafields | json }}

How does one enable collections to access product metafields in the Dawn theme?

Below are images of the metafields for namespace info.

Hi @willbeing ,

To better know whether your product section has access to metafields or not, inspect your product in the card-product.liquid file.

{{ product | json }}

If your product is null. It could be because you placed the code in the wrong file or because the name of the product variable is wrong.

The goal is to display metafield data for each product in a collection page. This data is not immediately available. The following solution works:

{% for product in collection.products %}
  {% if product.metafields.custom.width.value and product.id == card_product.id %}
    

{{ product.metafields.custom.width.value }}

  {% endif %}
{% endfor %}