Shopify：正确引用 js、css 等...资产

Question

我上传了一个 js 文件到 assets 并在末尾放了一个 .liquid 扩展名。 (mysite.js.liquid)

我在我的页面 html 中这样引用它....

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

我也试过了...

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

但是，当我查看页面时，我看到的是实际文本。知道为什么吗？执行此操作的正确方法是什么？

此外，我在网上看到建议将这些脚本引用放在 head 标记中，但是，我不希望每个使用此主题的页面都这样做。我只想将此 js（也 css 等）用于此特定页面。

有什么想法吗？谢谢！

Answer 1

你可以用{{ "mysite.js" | asset_url | script_tag }}来调用它，不管文件是否在.liquid结束。如果是这样，Shopify 将处理其中的任何液体模板，并生成一个 .js 文件，这是您 link.

需要的文件

为什么要获取原始文本没有多大意义。您是否有机会检查原始标签之间是否没有此代码？ {% raw %} YOUR CODE {% endraw %}。 https://help.shopify.com/themes/liquid/tags/theme-tags#raw

如果没有，请尝试提供您的 template/layout 发生这种情况的完整代码。

它们是在 head 上还是在 body 的末尾也没有关系，模板应该会为您提供正确的输出。那是你在这些文件中有什么样的 JavaScript 的问题。您可以查看有关该 in this answer.

的更多信息

如果你想用于特定页面，一种常见的方法是使用一些液体条件逻辑，例如，假设我只想在 page.special.liquid 模板上加载此脚本标签.

{% if template contains 'special' %}
  {{ "mysite.js" | asset_url | script_tag }}
{% endif %}

Shopify: Referencing js, css, etc... assets correctly