Использование Liquid для отображения разных встраиваемых файлов .js в зависимости от URL страницы

#shopify #liquid

#Shopify #жидкий #liquid

Вопрос:

Я пытаюсь создать страницу Shopify collection для отображения разных встраиваемых файлов .js в определенной части страницы, в зависимости от URL текущей страницы.

Можно ли это сделать с помощью {% if page.url == %} если да, то как у меня будут варианты 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>```
  

Ответ №1:

В каждом магазине Shopify есть разные типы страниц: индекс (он же главная страница), продукт, коллекция, страница, блог, статья и корзина. Вот полный список типов страниц.

Итак, это page.url будет работать только с объектом типа page page для всех других типов вам нужно использовать соответствующий объект 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 %}
  

ссылка

Вам нужно будет проверить, 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 %}
  

Это не пуленепробиваемое решение, однако его должно быть достаточно для того, чтобы вы могли строить поверх него.

Удачи!

Ответ №2:

Я рекомендую использовать page.handle и идентифицировать дескриптор. Я не верю, что page.url сделает то, что вам нужно

Ответ №3:

Вы также можете попробовать это, поскольку дескриптор никогда не может быть изменен.

 {% 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 %}