Отображение образца цвета на странице коллекции (не текст) Shopify - PullRequest
Новая
       44

Отображение образца цвета на странице коллекции (не текст) Shopify

0 голосов
/ 16 октября 2018

У меня есть код ниже - который показывает варианты в тексте, который цветной фон, и ссылку на вариант.Я хотел бы, чтобы вместо него был color.png '.png', но он не будет работать.

Как видите, код между "<.! - и ->" не работаеткажется, работает.Он показывает пустой .png в формате 16px x 16px.Я загрузил правильные цвета в разделе файлов shopify, например red.png, black.png и т. Д., Но он не будет отображаться.(да, технически это не в том месте, оно для тестирования) 

  <ul class="colorlist"> 
 {% for option in product.options %}
    {% if option == 'Color' %}
        {% assign index = forloop.index0 %}
         {% assign colorlist = '' %}
         {% assign color = '' %}
           {% for variant in product.variants %}
             {% capture color %}
               {{ variant.options[index] }}
             {% endcapture %}

               {% unless colorlist contains color %}
                {% if variant.available %}



<!-- <img src="{{ color | downcase | append: '.png' | asset_url }}"
alt="{{ color }}" width="16" height="16" /> -->


                    <li id="{{ variant.id }}" class="instock"><a href="{{ product.url | within: collection }}?variant={{ variant.id }}" style="background:{{ color | downcase }}">{{ color | downcase }}</a></li>

                {% else %}

                    <li id="{{ variant.id }}" title="Out of Stock"  class="outstock" >{{ color | downcase }}</li>

                {% endif %}

              {% capture tempList %}
                 {{colorlist | append: color | append: " " }}
              {% endcapture %}
         {% assign colorlist = tempList %}
       {% endunless %}
     {% endfor %}
   {% endif %}
 {% endfor %}
          </ul>

Какие изменения нужно внести, чтобы правильно работать, как я хочу?

Я просто хочучтобы это работало так: https://www.shopifytips.com/tech-tips/show-all-color-swatches-within-collection-pages.html

(что, этот код не работал, но я нашел похожий код в стеке, который работал: Показать все варианты цвета на странице Коллекции в Shopify, используя Бруклинскую тему)

1 Ответ

0 голосов
/ 17 октября 2018

Вы говорите, что загрузили PNG " в разделе файлов shopify ".
Это проблема.
Если вы используете фильтр asset_url , файлы PNGдолжен находиться в папке assets темы.
Использовать фильтр file_url , если изображения находятся в файлах.

...