How to add head and footer script fields to theme settings

It is often preferable to enable clients to add scripts (such as conversion code, live chat widgets, etc.) in the theme settings rather than in the theme code. It’s safer and just makes sense to keep them out of the theme code.

In theme.liquid in layout, add the following just before {{ content_for_header }}:

{{ settings.head_scripts }}

And add the following just before </body>:

{{ settings.footer_scripts }}

In settings_schema.config, add the following right at the end before the closing ]:

,
{
"name": "Scripts",
"settings": [
{
"type": "textarea",
"id": "head_scripts",
"label": "Head scripts"
},
{
"type": "textarea",
"id": "footer_scripts",
"label": "Footer scripts"
}
]
}

Leave a comment