Trim the content of {{ product | json }} to remove 'description' and 'content'

mfcss
Explorer
52 6 12

I have product pages that are very long (B2B technical products) with a lot of custom HTML. This works fine for most purposes, but it causes issues due to shopify's inclusion of below snippet in the product-template.liquid:

{% unless product == empty %}
<script type="application/json" id="ProductJson-{{ section.id }}">
{{ product | json }}
</script>
<script type="application/json" id="ModelJson-{{ section.id }}">
{{ product.media | where: 'media_type', 'model' | json }}
</script>
{% endunless %}

 

The result of this snippet is that a very large JSON object is added within the HTML of my page, increasing loading time. The reason for this is that the entire content of my product page is "copied" into the "description" field of the JSON and the "content" field. This adds 50-150 kb to all my product pages, and causes issues in various SEO auditing tools because the HTML gets too large.

 

I tried removing the above snippet entirely and for the most part it seems like it works. However, it turns out that doing so causes issues for products using Shopify's "variant" system as users can no longer add variants to their cart (they'll get the default product in that case).

 

I suspect the reason for this is that the JSON output object contains information on e.g. the variants - and therefore I cannot delete it entirely. 

 

However, I cannot see there being any use of the long "description" and "content" fields so I would like to remove/filter these out when the JSON object is being parsed. Is there some way to do this via Liquid so that I load the entire liquid variable as above - but excluding certain properties?

Reply 1 (1)
hawkscode
Shopify Partner
74 15 13

Hi @mfcss 

 

can you hire me 



If helpful, please Like and Accept Solution.
if you Want to modify or Customize your theme ,
- Feel free to contact me on vikash.hawkscode@gmail.com regarding any help
- Skype : vikas.hawkscode