2017-09-12 9 views
1

jekyllを使用してブログページに投稿します。私は "行"クラスのすべてのdivの2つの投稿がありますが、私はまた、すべての4番目の項目は、(ポストをスキップし、次の行に移動するが、まだ投稿ではないものを含む)広告になりたい。ループの4番目の項目ごとにジキルが異なるように表示されます

だから、6件の記事がある場合、出力は私がポストループ部分を持って、この

<div class="row"> <!-- 1st row --> 
    <div> {{ post.title }} </div> <!-- 1st post, no skip --> 
    <div> {{ post.title }} </div> <!-- 2nd post, no skip --> 
</div> 

<div class="row"> <!-- 2nd row --> 
    <div> {{ post.title }} </div> <!-- 3rd post, no skip --> 
    <div> THIS IS NOT A POST </div> <!-- skip post 4, put something else --> 
</div> 

<div class="row"> <!-- 3rd row --> 
    <div> {{ post.title }} </div> <!-- 4th post, because last item was skipped to display something else --> 
    <div> {{ post.title }} </div> <!-- 5th post, no skip --> 
</div> 

<div class="row"> <!-- 4th row --> 
    <div> {{ post.title }} </div> <!-- 6th post, no skip --> 
</div> 

<!-- and so on, so every 4th item is not a post, but the posts continue after the skipped post --> 

ようになっているはずですが、私はSKIP

{% assign rows = site.posts.size | divided_by: 2.0 | ceil %} 
{% for i in (1..rows) %} 
    {% assign offset = forloop.index0 | times: 2 %} 
    <div class="row blogitems"> 
    {% for post in site.posts limit:2 offset:offset %} 
     <div class="col-md-6"> 
      <p>{{ post.title }}</p> 
     </div> 
    {% endfor %} 
    </div> 
{% endfor %} 

答えて

1

私はあなたを考えるを追加する方法を見つけ出すカントmoduloをチェックしながらアイテムを歩いているだけです。このように:

<div class="row blogitems"> 
{% for post in site.posts %} 
    {% assign mod3 = forloop.index | modulo: 3 %} 
    <div class="col-md-6"><p>{{ post.title }}</p></div> 
    {% if mod3 == 0 %}<div class="col-md-6"><p>THIS IS NOT A POST</p>{% endif %} 
    {% if mod3 == 0 or mod3 == 2 %}</div><div class="row blogitems">{% endif %} 
{% endfor %} 
</div> 
+0

これは素晴らしいです!完璧な答えをお寄せいただきありがとうございます。どのように見えるかチェックしたい場合は、私のブログのライブバージョンがあります:) https://somiibo.com/blog/ –

+0

あなたはようこそ。ニースのブログ。私の唯一の発言:何かがプリローダーに間違っています。サイトの読み込み(サイトが表示されます)、プリローダーが表示され、サイトが再び表示されます。 – JoostS

+0

ヘッドアップに感謝します。そのようなものを知ることは役に立ちます!私はプリローダーのCSSがページの上部に取り込まれているので、なぜそれが起こるのか分かりません:/ –

関連する問題