0

I uploaded a js file into assets and put a .liquid extension on the end. (mysite.js.liquid)

I refer to it in my page's html like this....

{{ "mysite.js" | asset_url | script_tag }}

I've also tried...

{{ "mysite.js.liquid" | asset_url | script_tag }}

BUT, when I view the page I see the ACTUAL TEXT. Any idea why? What's the proper way to do this?

Also, I've seen online that it's recommended to put these script references in the head tag, BUT, I do not want this for every page that uses this theme. I just want to use this js (also css, etc) for this particular page.

Any ideas? Thanks!

WebDevGuy
  • 173
  • 4
  • 18

1 Answers1

2

You can call it with {{ "mysite.js" | asset_url | script_tag }}, doesn't matter if the file ends on .liquid or not. If it does, Shopify will process any liquid templating inside it, and generate a .js file which is the one you need to link.

It doesn't make much sense why you're getting the raw text. Any chances you can check you don't have this code between raw tags? {% raw %} YOUR CODE {% endraw %}. https://help.shopify.com/themes/liquid/tags/theme-tags#raw

If not, please try to provide with the full code of your template/layout where this is taking place.

It also doesn't matter if these are on the head or on the very end of the body, the templating should give you the right output. That's a matter of what kind of JavaScript do you have in these files. You can view more information about that in this answer.

If you want to use for a particular page, a common way is to use some liquid conditional logic, for example, let's say I want to load this script tag only if we're on page.special.liquid template.

{% if template contains 'special' %}
  {{ "mysite.js" | asset_url | script_tag }}
{% endif %}
Community
  • 1
  • 1
Juan Ferreras
  • 2,801
  • 2
  • 13
  • 16
  • What is the conditional logic for if the PAGE contains a word? @JuanFerreras – WebDevGuy Aug 27 '16 at 20:40
  • If the page contains a word? You could try using `page.content`, but to be honest, a better practice would be to make sure that page uses a different template – Juan Ferreras Aug 28 '16 at 11:44