html - Shopify tablerow 循环提前退出

标签 html css shopify liquid

我正在遍历我的首页产品集合并生成一个表格。在最后一行,我需要在第一个表格单元格中放置一些静态内容。我已经能够做到这一点,但由于某种原因,循环在它这样做之后停止了。有谁知道为什么吗?

  {% tablerow product in collections.frontpage.products cols: 2 %}
    {% if tablerowloop.col_first and tablerowloop.last %}
      <img src="{{'box.png' | asset_url}}">
    {% else %}
      <div class='featured-product'>
        <img src="{{ product.images[1] | product_img_url: 'medium' }}">
        <p>{{ product.title }}</p>
      </div>
    {% endif %}
  {% endtablerow %}

这是网站:https://hodkiewicz-zieme-and-hirthe180.myshopify.com/

最佳答案

tablerowloop.last 只为表的最后一个单元格(即集合的最后一个产品)返回 true,而不是最后一行。相反,您需要检查索引是否在集合末尾的 cols 内,如果它是第一列,则它必须是最后一行。

{% tablerow product in collections.frontpage.products cols: 2 %}
  {% assign x = tablerowloop.length | minus:2 %}
  {% if tablerowloop.col_first and tablerowloop.index > x %}
    <img src="{{'box.png' | asset_url}}">
  {% else %}
    <div class='featured-product'>
      <img src="{{ product.images[1] | product_img_url: 'medium' }}">
      <p>{{ product.title }}</p>
    </div>
  {% endif %}
{% endtablerow %}

关于html - Shopify tablerow 循环提前退出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13186336/

相关文章:

javascript - 通过javaScript将 'tap'添加到Html中

javascript - BigVideo.js - 未捕获类型错误 : undefined is not a function

php - 从选择多个中获取值并将它们放入数据库

css - 非静态页脚导航栏出现在移动设备屏幕底部上方

ios - Shopify 网站仅在 Ipad 的右侧提供空白

javascript - Shopify 脚本标签

php - Shopify (liquid) - 如果页面模板等于,则将类添加到 div

html - border-image 不会在 chrome 中渲染 block 的内部背景

html - 如何使用CSS移动div的位置

jquery - 文本字符串旁边的竖线