使用Liquid根据页面URL显示不同的.js嵌入

问题描述

我试图获得一个Shopify集合页面，以根据当前页面的URL在页面的特定部分上显示不同的.js嵌入。

如果可以的话，是否可以使用{% if page.url == %}完成操作，我将如何获得页面URL和特定嵌入代码的变体？

页面网址如下：

https://www.example.com/collections/technology/technology-connected-home

嵌入代码如下：

<script type="text/javascript" src="https://apps.example.com/app/js/18218989163.js"></script>```

解决方法

每个Shopify商店都有不同类型的页面：索引（又名首页），产品，馆藏，页面，博客，文章和购物车。这是页面类型的full list。

因此，对于您需要使用适当的页面对象获取page.url的所有其他类型，此page仅适用于url类型的页面对象：

collection.url
product.url
等...

在您的情况下，建议您使用case/when，在代码段中添加您的逻辑，并在render中将其theme.liquid中添加。

这里是一个例子：

{% if request.page_type == 'page' %}
  {% case page.url %}
    {% when '/pages/about-us' %}
      {{ 'pages__about-us.js' | script_tag }}
    {% when '/pages/contact-us' %}
      {{ 'pages__contact-us.js' | script_tag }}
    {% else %}
      {{ 'pages__generic.js' | script_tag }}
  {% endcase %}
{% endif %}

ref

您必须在创建request.page_type之前检查case/when，否则另一种方法是检查代码段顶部的类型，例如：

{% comment %} Set page object type {% endcomment %}
{% case request.page_type %}
  {% when 'page' %}
    {% assign page_object = page %}
  {% when 'collection' %}
    {% assign page_object = collection %}
  {% when 'product' %}
    {% assign page_object = product %}
{% endcase %}

{% comment %} Load JS based on page URL{% endcomment %}
{% case page_object.url %}
  {% when '/pages/about-us' %}
    {{ 'pages__about-us.js' | script_tag }}
  {% when '/pages/contact-us' %}
    {{ 'pages__contact-us.js' | script_tag }}
  {% else %}
    {{ 'pages__generic.js' | script_tag }}
{% endcase %}

这不是防弹解决方案，但是足以让您在此之上构建。

祝你好运！

我建议使用page.handle并标识手柄。我认为page.url不会满足您的需求

您也可以尝试此操作，因为永远无法更改句柄。

{% case page.handle %}
    {% when 'about-us' %}
      {{ 'pages_about-us.js' | script_tag }}
    {% when 'contact-us' %}
      {{ 'pages_contact-us.js' | script_tag }}
    {% else %}
      {{ 'pages_generic.js' | script_tag }}
  {% endcase %}

liquid shopify