【问题标题】:show product vendor on collection page在集合页面上显示产品供应商
【发布时间】:2023-04-02 05:52:01
【问题描述】:

我正在使用 shopify 主题并尝试在主系列页面上输出产品供应商信息。我尝试将<p>{{ product.vendor | link_to_vendor }}</p> 放在多个地方,这些地方在我的主题的另一个领域工作,但我没有运气——有人可以帮忙解释我如何做到这一点吗?下面的代码用于我的 collection.liquid 文件

 {% capture collectionDescription %}
      {% if collection.description != blank and settings.collection-show-description %}
        <div class="collection-description rte">
          {{ collection.description }}
        </div>
      {% endif %}
    {% endcapture %}


    {% if collection.image and settings.collection-show-featured-image %}
      <div class="page-title collection-header-wrapper" style="background-image: url({{ collection.image.src | collection_img_url: '1024x1024' }});">
        <div class="collection-header">
          <h1>{{ collection.title }}</h1>
          {{ collectionDescription }}
        </div>
      </div>
    {% elsif collection.handle == 'all' %}
      <h1 class="page-title">{{ 'collections.collection.all_products' | t }}</h1>
      {{ collectionDescription }}
    {% else %}
      <h1 class="page-title">{{ collection.title }}</h1>
      {{ collectionDescription }}
    {% endif %}

    {% assign productsPerPage = settings.collection-products-per-row | times: settings.collection-number-of-rows %}
    {% paginate collection.products by productsPerPage %}

    {% if collection.all_tags.size > 0 and settings.collection-enable-tag-filtering %}
    <div class="collection-tag-selector">

      {% assign fallback = '' %}
      {% if collection.handle %}
        {% capture link %}/collections/{{ collection.handle }}{% endcapture %}
        {% assign fallback = link %}
      {% elsif collection.products.first.type == collection.title %}
        {% capture link %}{{ collection.title | url_for_type }}{% endcapture %}
        {% assign fallback = link %}
      {% elsif collection.products.first.vendor == collection.title %}
        {% capture link %}{{ collection.title | url_for_vendor }}{% endcapture %}
        {% assign fallback = link %}
      {% endif %}

      <div class="select-wrapper">
        <div class="selected-text">
          {% if current_tags %}
            {{ current_tags.first }}
          {% else %}
            {{ 'collections.collection.browse' | t }}
          {% endif %}
        </div>
        <select data-fallback-url="{{ fallback }}">
          {% if current_tags %}
            <option name="reset">-- {{ 'collections.collection.clear' | t }} --</option>
          {% else %}
            <option name="browse" selected disabled>{{ 'collections.collection.browse' | t }}</option>
          {% endif %}
          {% for tag in collection.all_tags %}
            {% if current_tags contains tag %}
              <option name="{{ tag | handle }}" selected>{{ tag }}</option>
            {% else %}
              <option name="{{ tag | handle }}">{{ tag }}</option>
            {% endif %}
          {% endfor %}
        </select>
      </div>

    </div>
    {% endif %}

    <div class="collection-products products-per-row-{{settings.collection-products-per-row}}">
      {% for product in collection.products %}
        {% include 'product-list-item' %} 
      {% else %}
        <p class="empty">{{ 'collections.collection.no_products' | t }}</p>
      {% endfor %}

    </div>


    {% if paginate.previous or paginate.next %}
      {% include 'pagination' %}
    {% endif %}

    {% endpaginate %}

【问题讨论】:

    标签: themes shopify liquid


    【解决方案1】:

    产品有供应商。正如您所指出的,简单的 Liquid 构造是 product.vendor。因此,当您遍历集合中的所有产品时,您当然可以访问它们。那么你的实际问题是什么?如果您想显示供应商,最好的位置似乎是在您的包含文件“product-list-item”中,因为这是您的产品将被实例化的地方。

    【讨论】:

    • 所以我想做的是这个;当用户选择一个集合时,我的主题显示产品和价格,但不显示供应商。我想输出供应商并将其链接到供应商页面。包含文件在哪里?我还添加了一张图片来显示没有显示产品供应商!
    • 片段 -> 产品列表项
    【解决方案2】:

    我必须在 {{ product.vendor }} 不起作用的集合模板中执行此操作,因为产品对象不容易获得。看起来是这样的:

    {% for product_vendor in collection.all_vendors %}
      {{ product_vendor | link_to_vendor }}
    {% endfor %}
    

    【讨论】:

      猜你喜欢
      • 2021-12-12
      • 1970-01-01
      • 2022-08-23
      • 1970-01-01
      • 2017-06-24
      • 2022-01-26
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多