Shopify / liquid - добавление классов и удаление введенного текста

Я работаю над темой Shopify (Slate) с очень ограниченным опытом. Мне нужно добавить несколько классов, которые я обработал для изображений, но не могу найти способ сделать это для привязки, включенной в <h2 class="mosaic__title p-name">{{ item.title | link_to: item.url }}</h2>.

Также у меня есть некоторые цены, перед которыми вставлен текст типа «В продаже от». Не знаю, как это добавляется и как убирать. Вот пример:

<del>{{ item.compare_at_price | money }}</del>
{% assign sale_price = item.price | money %}
{{ 'products.product.on_sale_from_html' | t: price: sale_price }}

Я пробовал удалить .on_sale_from_html и t: price: sale_price, но это не работает / ломается.

Кто-нибудь может посоветовать по этому поводу? Спасибо!

Полный раздел кода для справки:

<div class="mosaic__caption">
  <h2 class="mosaic__title p-name">{{ item.title | link_to: item.url }}</h2>

  {% if item.object_type == 'product' %}
    <p class="mosaic__value">
      {% if item.compare_at_price > item.price %}
        {% if item.price_varies %}
          <del>{{ item.compare_at_price | money }}</del>
          {% assign sale_price = item.price | money %}
          {{ 'products.product.on_sale_from_html' | t: price: sale_price }}
        {% else %}
          {{ 'products.product.on_sale' | t }}
          <data itemprop="price" class="p-price">{{ item.price | money }}</data>
        {% endif %}
        <data class="visually-hidden p-price">{{ 'products.product.regular_price' | t }}</data>
      {% else %}
        {% if item.price_varies %}
          {% assign price = item.price | money %}
          <data itemprop="price" class="p-price">{{ 'products.product.from_text_html' | t: price: price }}</data>
        {% else %}
          <data itemprop="price" class="p-price">{{ item.price | money }}</data>
        {% endif %}
      {% endif %}
      {% unless item.available %}
      {{ 'products.product.sold_out' | t }}
      {% endunless %}
    </p>
  {% else %}
    <p>{{ item.content | strip_html | truncatewords: 50 }}</p>
  {% endif %}
</div>

person user1406440    schedule 05.05.2018    source источник


Ответы (1)


Начнем с фильтра link_to. Этот код: <h2 class="mosaic__title p-name">{{ item.title | link_to: item.url }}</h2>

link_to принимает URL-адрес и просто создает элемент ссылки HTML с предоставленным текстом и ссылкой.

Таким образом, приведенный выше код такой же, как:

<h2 class="mosaic__title p-name">
  <a href="{{item.url}}">{{item.title}}</a>
</h2>

Таким образом, вы можете написать в качестве альтернативы приведенный выше код или использовать фильтр замены, чтобы добавить атрибут класса, например, так: item.title | link_to: item.url | replace: '<a', '<a class="foo"'


Что касается вашего второго вопроса, такие результаты {{ 'products.product.on_sale_from_html' | t: price: sale_price }} указывают на то, что это переводимый текст.

Это означает, что ваш текст находится в вашем файле перевода (обычно en.default.json в вашей locales папке), поэтому вы можете изменить текст оттуда.

Что касается добавленного текста, похоже, что ваша переведенная строка содержит следующую переменную {{ price }}, которая заменяется переданной переменной price: sale_price.

PS: прочтите документацию в Shopify, где эти функции описаны более подробно: https://help.shopify.com/themes/liquid/filters/url-filters#link_to https://help.shopify.com/themes/development/internationalizing/locale-files#values​​

person drip    schedule 05.05.2018
comment
Спасибо, что сработало, и я немного больше понимаю о файле перевода. Если мне вообще не нужен текст, могу ли я просто удалить его (например) из кода {{ 'products.product.on_sale_from_html' | t: price: sale_price }} или просто удалить текст из файла перевода, оставив поле пустым? - person user1406440; 06.05.2018
comment
Вам решать, если вы не хотите, чтобы строка удаляла текст. (вы также можете редактировать языковой файл из панели администратора, в разделе Themes -> More Actions -> Languages). - person drip; 06.05.2018
comment
Да мне вообще не нужен текст. Я думал, что смогу просто удалить t ссылку и on_sale_form_html, и это просто отобразит цену, но похоже, что я не могу этого сделать. - person user1406440; 06.05.2018