Как скрыть список, если в Shopify не отображаются теги?

Я пытаюсь скрыть раздел фильтра, если для текущей коллекции нет тегов.

Вот мой текущий код:

{% assign tags = 'Blue, Grey, Black, Oak, Bronze, Pewter, Gunmetal, Utile, Mahogany' | split: ',' %}
{% assign colour = tags | size %}
 <ul class = "subnav clearfix" {% if colour <= 0 %} style = "display: none;" {% endif %}>
  <li class = "coll-filter filter-heading clearfix">
   <label>Colour</label>
   <hr class = "hr--sidebar">
   {% for t in tags %}
   {% assign tag = t | strip %}
   {% if current_tags contains tag %}
    <li class = "selection{% unless current_tag %} active{% endunless%}">
     <span>{{ tag | link_to_remove_tag: tag }}</span>
    </li>
   {% elsif collection.tags contains tag %}
    <li class = "selection{% unless current_tag %} active{% endunless%}">
     <div id = "swatch-{{ tag }}" class = "colour-filter">&nbsp;</div>
      <span> {{ tag | link_to_tag: tag }}</span>
    </li>
   {% endif %}
  {% endfor %}
 </li>
</ul>


{% assign tags = 'Egyptian Cotton, Silk, Satin, Salt' | split: ',' %}
{% assign material = tags | size %}
 <ul class = "subnav clearfix" {% if material <= 0 %} style = "display: none;" {% endif %}>
  <li class = "coll-filter filter-heading clearfix">
   <label>Material</label>
   <hr class = "hr--sidebar">
   {% for t in tags %}
   {% assign tag = t | strip %}
    {% if current_tags contains tag %}
     <li {% unless current_tag %}class = "active"{% endunless%}>
      {{ tag | link_to_remove_tag: tag }}
     </li>
    {% elsif collection.tags contains tag %}
     <li>
      {{ tag | link_to_tag: tag }}
     </li>
    {% endif %}
   {% endfor %}
  </li>
 </ul>

{% assign tags = 'Small, Medium, Large' | split: ',' %}
{% assign size = tags | size %} 
 <ul class = "subnav clearfix" {% if size <= 0 %} style = "display: none;" {% endif %}>
  <li class = "coll-filter filter-heading clearfix">
   <label>Size</label>
   <hr class = "hr--sidebar">
   {% for t in tags %}
   {% assign tag = t | strip %}
   {% if current_tags contains tag %}
    <li {% unless current_tag %}class = "active"{% endunless%}>
     {{ tag | link_to_remove_tag: tag }}
    </li>
   {% elsif collection.tags contains tag %}
    <li>
     {{ tag | link_to_tag: tag }}
    </li>
   {% endif %}
  {% endfor %}
 </li>
</ul>

{% assign tags = 'Under £5, £15-£100, £100-£250, £250-£750, £750-1000£, £1000' | split: ',' %}
{% assign price-range = tags | size %}
 <ul class = "subnav clearfix" {% if price-range <= 0 %} style = "display: none;" {% endif %}>
  <li class = "coll-filter filter-heading clearfix">
   <label>Price Range</label>
   <hr class = "hr--sidebar">
   {% for t in tags %}
   {% assign tag = t | strip %}
   {% if current_tags contains tag %}
    <li {% unless current_tag %}class = "active"{% endunless%}>
     {{ tag | link_to_remove_tag: tag }}
    </li>
   {% elsif collection.tags contains tag %}
    <li>
     {{ tag | link_to_tag: tag }}
    </li>
   {% endif %}
  {% endfor %}
 </li>
</ul>

Мой код был обновлен на основе ответов ниже. В настоящее время все еще не работает.

Я был уверен, что это не работает из-за того, что у меня есть несколько фильтров, а затем я назначил размер, цвет, материал и ценовой диапазон тегам?

Заранее спасибо.

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...
1
0
149
2

Ответы 2

Убедитесь, что коллекция тегов меньше или равна нулю, а затем примените стиль display: none.

{% if tags <= 0%}

См. Мой обновленный код выше. Я пробовал добавить его в тег <ul> вот так. <ul class = "subnav cleafix" {% if tags <= 0 %} style = "display: none;" {% endif %}, и это не сработало.

Allsops 14.05.2018 16:34

Попробуй это

{% assign tags = 'Egyptian Cotton, Silk, Satin' | split: ',' %}
{% assign count = 0 %}
{% for t in tags %}
  {% assign tag = t | strip %}
  {% if current_tags contains tag or collection.all_tags contains tag %}
    {% increment count %}
  {% endif %}
{% endfor %}

<ul class = "subnav clearfix" {% if count <= 0 %} style = "display:none" {% endif %} >
 <li class = "coll-filter clearfix{% unless current_tags %} active{% endunless %}">
   <label>Material</label>
    <hr class = "hr--sidebar">
     {% for t in tags %}
      {% assign tag = t | strip %}
       {% if current_tags contains tag %}
        <li {% unless current_tag %}class = "active"{% endunless%}>
         {{ tag | link_to_remove_tag: tag }}
        </li>
       {% elsif collection.all_tags contains tag %}
       <li>
       {{ tag | link_to_tag: tag }}
      </li>
   {% endif %}
  {% endfor %}
 </li>
</ul>

Это тоже не сработало :( Я не знаю, имеет ли это значение, у меня есть несколько фильтров. Я обновил свой код в основном сообщении, чтобы отразить это.

Allsops 16.05.2018 09:51

Размер - это метод, который можно обновить: {% assign price-range = tags | ценовой диапазон%} от {% assign price-range = теги | size%} и он будет работать

Sulli Zerance 16.05.2018 20:15

Я понимаю, в чем проблема, я обновил свой код

Sulli Zerance 18.05.2018 15:19

Все еще не работает. Я обновил это, и фильтр над содержимым изменится на 0 1 2, а затем фильтр, к которому я применил это, исчезнет, ​​хотя в настоящее время есть продукты, теги которых применяются к этому фильтру.

Allsops 21.05.2018 10:25

Другие вопросы по теме