Dawn Theme - Show Product Metafields in the Collection Grids

[willbeing]

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.

[BSS-Commerce]

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.

[willbeing · Accepted solution]

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 %}
    <p>{{ product.metafields.custom.width.value }}</p>
  {% endif %}
{% endfor %}