We are creating a landing page for a client which requires custom metadata to be served and curated. The Open Graph description field for example should be defined in the Shopify Admin panel for that specific page. Our solution is to pull a section into a the head tag of a custom layout file. The problem is all sections include a div wrapper. We have overcome that problem by capturing the contents of the section then doing a liquid string replace on the opening and closing section div tags. This works perfectly but results in a cryptic invalid HTML error from Shopify in the Admin ui.
HTML error found
Broken HTML has been detected in your theme's sections/crocs-head.liquid file. Check that there are no missing or extra HTML tags present.
If you haven't made changes to this code, contact support for help resolving the issue.
Finally I've run the resulting page through the W3C validator and found no relevant HTML errors. I believe Shopify may be looking for that div to be present during validation and if not found they show the HTML error in the Admin UI. This is not the end of the world but can obviously be alarming to our client at first. I'm also open to other solutions if possible. Thanks in advance!
We have also created an example store using the default theme to illustrate the issue.
Community Blog Articles
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024
We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024