Arun_O
June 19, 2023, 11:33am
1
Hey All.
My store URL is https://caresmith-india-cd1f.myshopify.com/ I am using Ella theme for shopify and somehow all my metafields are displaying in what I believe is JSON format instead of how they should be displayed.
They are rich text metafields and this is the output they are giving on the front end.
{"type":"root","children":[{"listType":"unordered","type":"list","children":[{"type":"list-item","children":[{"type":"text","value":"Item 1"}]},{"type":"list-item","children":[{"type":"text","value":"Item 2"}]},{"type":"list-item","children":[{"type":"text","value":"Item 3"}]}]}]}
On the product page in the metafield editor it shows perfectly fine as
but on the product page on the front end it shows that unformatted metafield code
Would appreciate any help
Add .value at the end of your metafield variable. Let us know if that does it!
Arun_O
June 19, 2023, 11:55am
3
At the end of the variable name? or in the product-tab.liquid where the metafield is referenced?
Arun_O
June 19, 2023, 12:00pm
4
Hereâs the liquid for the metafield tab
{%- liquid
assign title = block.settings.title
assign has_tab = false
assign source = block.settings.product_custom_source
assign key = block.settings.product_tab_key_metafield
if source == 'dynamic'
assign meta_ref = key
else
assign meta_ref = product.metafields.c_f[key]
endif
if block.type == 'custom'
if block.settings.type == 'metafield'
if meta_ref
assign has_tab = true
assign content = meta_ref
else
assign has_tab = false
endif
else
assign has_tab = true
assign content = block.settings.content
endif
else
assign has_tab = true
if block.type == 'description'
assign content = product.description
else block.type == 'review'
assign content = product.metafields.spr.reviews
endif
endif
if block.type == 'description' or block.type == 'review' or block.type == 'custom'
assign style_mobile = false
if block.settings.open_tab_mobile
assign style_mobile = 'show-mobile'
endif
if tab_layout_mobile == 'popup'
assign style_mobile = 'popup-mobile'
endif
endif
-%}
Arun_O
June 19, 2023, 6:20pm
5
Still looking for a solution for this. Would appreciate any help
Did you ever solve this issue? I am facing the same problem.
Hi @Hunter11
This is a relatively easy one to fix. When you want to render/output the content you need to apply the metafield_tag filter to it.
In liquid this is just:
{{ RTE_METAFIELD_REFERENCE | metafield_tag }}
to output it. If you need it as a variable you can use the following (or you can capture it):
{% assign VARIABLE_NAME = RTE_METAFIELD_REFERENCE | metafield_tag %}
You wonât be able to do anything with these fields without delving into a bit of template modification.
1 Like
I am attaching the code snippet for the product page tab. Hopefully, by looking at it, youâll be able to indicate where to put one of these lines of code to fix this issue. Thank you for your assistance.
{%- case block.settings.content %}
{% when 'description' %}
{{product.description}}
{% when 'reviews' %}
{% if settings.reviewApp == "loox" %}
{{ product.metafields.loox.reviews }}
{% elsif settings.reviewApp == "shopifyReviews" %}
{{ product.metafields.spr.reviews }}
{% elsif settings.reviewApp == "alireviews" %}
{{ shop.metafields.review_collector.review_code }}
{% endif %}
{% when 'custom' %}
{{block.settings.customContent}}
{% when 'metafield' %}
{% assign metafield = product.metafields[block.settings.metafieldNS][block.settings.metafieldKey] %}
{{metafield}}
{% when 'page' %}
{% assign page = pages[block.settings.page] %}
{{page.content}}
{% when 'productPage' %}
{% assign handle = 'content-' | append: product.handle %}
{% assign page = pages[handle] %}
{% assign price = product.price | money | strip_html %}
{% assign prediscount = product.compare_at_price_max | money | strip_html %}
{{page.content | replace: '%product%', product.title | replace: '%brand%', product.vendor | replace: '%price%', price | replace: '%prediscount%', prediscount}}
{% endcase %}
{% comment %}
{% blockdef %}
{% endblockdef %}
{% endcomment %}
Assuming that the metafield is always a Rich Text metafield, you can edit the code to the following:
{%- case block.settings.content %}
{% when 'description' %}
{{product.description}}
{% when 'reviews' %}
{% if settings.reviewApp == "loox" %}
{{ product.metafields.loox.reviews }}
{% elsif settings.reviewApp == "shopifyReviews" %}
{{ product.metafields.spr.reviews }}
{% elsif settings.reviewApp == "alireviews" %}
{{ shop.metafields.review_collector.review_code }}
{% endif %}
{% when 'custom' %}
{{ block.settings.customContent }}
{% when 'metafield' %}
{% assign metafield = product.metafields[block.settings.metafieldNS][block.settings.metafieldKey] %}
{% if metafield contains '"children":' %}
{{ metafield | metafield_tag }}
{% else %}
{{ metafield }}
{% endif %}
{% when 'page' %}
{% assign page = pages[block.settings.page] %}
{{page.content}}
{% when 'productPage' %}
{% assign handle = 'content-' | append: product.handle %}
{% assign page = pages[handle] %}
{% assign price = product.price | money | strip_html %}
{% assign prediscount = product.compare_at_price_max | money | strip_html %}
{{page.content | replace: '%product%', product.title | replace: '%brand%', product.vendor | replace: '%price%', price | replace: '%prediscount%', prediscount}}
{% endcase %}
{% comment %}
{% blockdef %}
{% endblockdef %}
{% endcomment %}
Note that this does a simple if else check to see if it contains the string of text ââchildrenâ:â (all Rich Text metafields have this text inside).
Obviously make sure youâve got a copy of your code and let me know if you have any issues.
1 Like