creating a table using custom tab in ella theme

Hello,

I want to create a table in ella theme as a separate product description tab using custom tab. I followed all the instructions specified here. I am able to get the table but the json code is also seen along with the table (as in screenshot), which shouldn’t be seen under the table. Please help me solve this. Thank you.

Du bist hier in der deutschen Community. Wie der Partner im anderen Thread bereits gesagt hat, das Ella Theme wird nicht von Shopify unterstützt also sind die Theme Entwickler von Themeforest hier deine besten Ansprechpartner!

You can also click on uzairooo01 or Sonya_2025 link and send them a private message asking how they solved it. Anyway, ensure that your specification-table.liquid file properly loops through the metafield data and avoids outputting raw JSON, as seen in your above screenshot. Update the code to process the JSON and render the table correctly, like in this example:

{%- if product.metafields.c_f.specifications and product.metafields.c_f.specifications.value.size > 0 -%}
  
    {%- for row in product.metafields.c_f.specifications.value -%}
      
        {%- for col in row -%}
          {%- if forloop.first -%}
            
          {%- else -%}
            
          {%- endif -%}
        {%- endfor -%}
      
    {%- endfor -%}
  

| {{ col | escape }} | {{ col | escape }} |
| - | - |

{%- endif -%}

Add the specification-table snippet within the condition for the custom tab type, like this one:

{%- if block.type == 'specifications' -%}
  {% render 'specification-table' %}
{%- endif -%}

If the JSON is being displayed, it suggests that the metafield might be improperly formatted or the theme is outputting the raw JSON. To avoid this, ensure that the metafield value is properly formatted in Shopify admin, and use escape or json_parse to safely process the metafield value if it’s in JSON format.

In Shopify admin, verify that the metafield data is structured correctly for the table. It should look like:

[
  ["Specification", "Details"],
  ["Weight", "10kg"],
  ["Color", "Red"]
]

The solution provided still results in the same issue with the JSON code being rendered. Is there an alternative approach to solve this problem? Any suggestions are very welcome. Thanks! @Sonya_2025 or @uzairooo01 , please help me solve this.

Hey @ben2024

To find it out why still have the json code being rendered. I need check your theme code first. So feel free to email me!

1 Like