Render all metafields names from a product

[benoitalix]

I would like to render all the meta fields from a product in an accordion as a table with metafield's name on left column and metafield's value on right column. 

I already managed to render values doing something like this in the accordion.liquid file :

{%- assign features_items = product.metafields.custom -%}

render 'accordion-item', title: title, content: features_items, add_content_class: add_content_class, toggle_icon: toggle_icon, item_open: item_open

 Then :

<ul class="cc-accordion-features">
{% for feature in content %}
  {%- liquid
    assign label = feature[0]
    assign value = feature[1]
  -%}
  <li>
    <span class="label">{{ label }}</span>
    <span class="value">{{ value }}</span>
  </li>
{% endfor %}
</ul>

This works pretty fine, but the value is the namespace of the meta fields, so it gives me something like "My_meta_field". How would it be possible to render the names of the meta field ?

[maxdanko · Accepted solution]

Hello, this code snippet is responsible for outputting the names and values of meta fields. I hope this helps

{%- assign values_and_meta = blank -%}
    {%- assign title_list = blank -%}
    {%- assign value_list = blank -%}

    {%- for metafield in product.metafields.custom-%}
        {%- for item in metafield -%}
            {%- assign index = forloop.index0 | modulo: 2 -%}
            {%- if index == 0 -%}
                {%- assign title_list = title_list | append: item | append: '%%%'  -%}
            {%- else -%}
                {%- assign value_list = value_list | append: item | append: '%%%' -%}
            {%- endif -%}
        {%- endfor -%}
    {%- endfor -%}
   
    {%- assign splitted_titles = title_list | split: "%%%" -%}
    {%- assign splitted_values = value_list | split: "%%%" -%}

    {%- for value in splitted_values -%}
        title: {{- splitted_titles[forloop.index0] }}
        value: {{- value }}<br>
    {%- endfor -%}

[benoitalix]

Thanks for your answer, interesting code snippet !

I managed to display name with replacing underscores form namespaces by spaces with a liquid replace filter :

<ul class="cc-accordion-features">
{% for feature in content %}
  {%- liquid
    assign label = feature[0]
    assign value = feature[1]
    assign formatted_label = label | replace: '_', ' '
  -%}
  <li>
    <span class="label">{{ formatted_label }}</span>
    <span class="value">{{ value }}</span>
  </li>
{% endfor %}
</ul>