我们的商店安装了大约 20 个应用程序。在不同的页面上使用不同的应用程序。例如,有些应用仅在产品页面上使用。
但是我看到每个页面上都加载了所有应用程序。查看页面源代码,我看到 JavaScript 函数 asyncLoad
,它是内置 {{ content_for_header }}
变量的一部分。此功能为每个页面上的所有应用程序加载脚本。那么,我可以以某种方式限制它吗?我的意思是 - 避免下载我不在特定页面上使用的脚本/css/任何应用程序。例如,在主页上,我只需要激活几个应用程序,而不是全部 20 个。未在文档或 Google 中找到答案。
答案 0 :(得分:1)
听起来您已经对 Shopify 如何允许应用加载其脚本了如指掌,所以您已经大功告成!
当我需要有选择地禁用应用程序时,我已使用类似以下内容从 asyncLoad
函数中删除它们:
{% capture modified_content_for_header %}{{ content_for_header }}{% endcapture %}
{% if template.name == 'index' %}
{% assign modified_content_for_header = modified_content_for_header | remove: 'some_app_url.js,' %}
{% endif %}
<!-- If you have a lot of templates you are checking, a case/when using template.name might be appropriate -->
{{ modified_content_for_header }}
我喜欢使用 {% if template.name == value %} 而不是 {% if template contains value %} 进行模板检查,因为这样可以确保我不会意外得到一个误报出于某种原因包含其他模板类型之一的模板后缀,例如 collection.alternate_product_layout
或类似的东西。
免责声明:通过删除脚本文件来干扰 3rd 方应用程序可能会产生意想不到的副作用,因此请务必谨慎行事并对未发布的主题进行彻底测试!