Adding custom CSS and JS to Shopify
Simply upload your filename.js file in the assets folder.
then drop the following in your theme.liquid head section:
{{ 'filename.js' | asset_url | script_tag }}by the way, you should rename your file and add .liquid extension
filename.js.liquidGood luck!
If I understand correctly, the asset_url filter is what you are looking for.
To include a JS file in a .liquid file, you use:
{{ 'script.js' | asset_url | script_tag }}And a CSS file:
{{ 'style.css' | asset_url | stylesheet_tag }}
If you don't want to pollute the global namespace you can restrict the JavaScript or CSS to certain areas.
Shopify uses a simple if statement together with the page-handle for that(for www.foo.com/abcd/bar - "bar" would be the handle).
{% if page.handle == "bar" %} {{ 'your_custom_javascript.js' | asset_url | script_tag }} {{ 'your_custom_css.css' | asset_url | stylesheet_tag }}{% endif %} This is extremely useful if you want to make smaller changes to certain pages.