Metaobject value rendering with json code

Shopify Discussion

Topic summary

A user encountered an issue where a metaobject field containing rich text was rendering with unwrapped JSON code instead of formatted HTML in their Shopify liquid section.

Initial Problem:

  • Single-line text fields displayed correctly
  • Rich text field showed raw code/JSON instead of rendered content
  • Attempted fix using | richtext filter failed

Solution Found:
Replaced {{ testvariable.paragraph.value | richtext }} with {{ faq.answer | metafield_tag }}

Key Technical Detail:

  • The | metafield_tag filter properly converts Portable Text JSON (Shopify’s new structured content format) into valid HTML
  • The | richtext filter only works with older rich text formats and cannot handle the newer structured content

Status: Resolved - user successfully identified the correct filter for rendering modern Shopify metaobject rich text fields.

Summarized with AI on October 31. AI used: claude-sonnet-4-5-20250929.
1

Hi,

I have a metaobject in a liquid section on my page that is displaying single-line text as expected BUT I have a field with richtext that is rendering with some code wrapped around my dynamic content.

I tried adding a ‘{… .value | richtext }’ to my metaobject value without luck.

Here is my code in the liquid section:


  {% if page.metafields.custom.ja_faq %}
  {% assign testvariable = page.metafields.custom.ja_faq.value %}
    
    

        ## {{ testvariable.heading }}
      
        
            {{ testvariable.paragraph.value | richtext }}
        

    

    
  {% endif %}

Here is how it’s rendering:

Screenshot 2025-02-19 151329.png
Screenshot 2025-02-19 151329.png2091×238 44.5 KB

Appreciate the help!

2

Ok I finally figured this out. The solutions was to replace

{{ testvariable.paragraph.value | richtext }}

with

{{ faq.answer | metafield_tag }}

The " | metafield_tag" filter automatically converts Portable Text JSON into valid HTML and the filter " | richtext" is used for older rich text formats but does not properly handle the new structured content format.