跳过上一篇文章时如何忽略jekyll中的偏移

努尔苏丹·阿斯卡鲁利

我正在尝试在jekyll上创建我的第一个博客。我陷入了一件愚蠢的事情。所以主题是下一个:我有一个类别用于我的类别之一,让它成为“新闻”:

<section class="news">
    <div class="container">
        <div class="row no-gutters">

{% for post in site.categories.news limit: 2 offset: 0 %} 
{% include news-item-col-6.html %}
{% endfor %}

{% for post in site.categories.news limit: 3 **offset: 2** %}
{% include news-item-col-4.html %}
{% endfor %}

        </div>
    </div>
</section>

news-item-col-6:

{% if post.thumb != 0 %}
   <div class="col-md-6">
        <div class="pattern">
            <div class="overlay item-title" style="background-image: url({{ post.thumb }});">               
                <div class="item-title-content">
                    <h3><a href="{{ post.url }}">{{ post.header }}</a></h3>                     
                </div>
            </div>      
        </div>
    </div>
{% endif %}

news-item-col-4:

{% if post.thumb != 0 %}
  <div class="col-md-4">
    <div class="pattern">           
        <div class="overlay item-title" style="background-image: url({{ post.thumb }});">
            <div class="item-title-content">
                <h3><a href="{{ post.url }}">{{ post.header }}</a></h3>                 
            </div>
        </div>                  
    </div>
  </div>
{% endif %}

我的帖子

---
layout: post
title: title | site.com
header: title
description: discription
categories: categories url
catname: News
image: "images/URL /to image/1.jpg"
thumb: "images/URL /to thumb/1t.jpg"
permalink: "blog/:categories/:year-:month-:day-:slug.html"
---

因此问题在于,并非我的所有帖子都具有背景经验,而我要做的就是忽略没有{post.thumb}的帖子。代码是可行的,但是不幸的是col-md-4块的偏移量没有忽略post.thumb的发布顺序。

在下面的图片中,请尝试解释一下我想要的东西:

如果我所有的帖子都有post.thumb(bg_image),这就是应该的样子

这应该是这样,如果我的帖子Item2没有post.thumb(bg_image),它就不会显示在部分中

这就是我的代码的工作方式:D

那么应该怎么做才能使其正常工作呢?

附言:我的英语足够糟糕,所以我为语法错误感到抱歉,我恳求你们给出尽可能简单的答案...

乔斯特

只需使用一个自定义计数器,如下所示:

{% assign counter = 0 %} <!-- create a custom counter and set it to zero -->
{% for post in site.categories.news %} <!-- loop through the posts in news -->
  {% if post.thumb %} <!-- check if the post has a thumbnail -->
    {% assign counter = counter | plus: 1 %} <!-- increment the counter if it does -->
    {% if counter < 3 %} <!-- if this is the first or second counted post -->
      {% include news-item-col-6.html %} <!-- include the col-6 element -->
    {% elsif counter < 6 %} <!-- else -->
      {% include news-item-col-4.html %} <!-- include the col-4 element -->
    {% endif %}
  {% endif %}
{% endfor %}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章