Neo
プラグインでは、3つの子ブロックを追加するオプションを持つブロックを作成しましたその下に。
これは親ブロックのコードです:
{% extends 'neo/default' %}
{% block blockContent %}
<div
class="container"> <div class="row margin-60"> <div
class="col-sm-12 text-center">
{{ block.mainTitle }}
</div> </div> <div class="row margin-60">
{% if block.children %} {% for item in block.children %} {% if
loop.first %} {% include "neo/children/" ~ item.type %} {% endif %}
{% endfor %} {% endif %} </div> </div>
{% endblock %}
したがって、親ブロックは最大3つの子ブロックを持つことができます。
1つの行に3つのブロックがあり、各ブロックには「col-sm-4」クラスがあります(ブートストラップに慣れていない場合は1行に12までフィット)。
しかし、ユーザーが2つの子ブロックを持つことだけを選択した場合、
'col-sm-4'クラスは同じままになります。私はこのクラスを
'col-sm-6'に変更したいのですが、1つの子ブロックのみが選択されている場合は
'col-sm-12'です。
これは子ブロックのコードです
{% block blockContent %}
{% for block in entry.body %}
{% switch block.type.handle %}
{% case 'serviceItem' %}
<div class="col-sm-4 margin-20 wow fadeInUp" data-wow-delay="0.4s">
<div class="text-center margin-20"></div>
{{ block.text }}
LEARN MORE
</div>
{% endswitch %}
{% endfor %}
{% endblock %}
最初に試したのは、子ブロックの長さです。そしてその数を定義し、ifステートメントの助けを借りて、次のようにレイアウトを変更します。
{% set numberOfItems = block.serviceItem|length %}
{% if numberOfItems == 1 %}
<div class="col-sm-12 margin-20 wow fadeInUp" data-wow-delay="0.4s">
<div class="text-center margin-20"></div>
{{ block.text }}
LEARN MORE
</div>
{% elseif numberOfItems == 2 %}
<div class="col-sm-6 margin-20 wow fadeInUp" data-wow-delay="0.4s">
<div class="text-center margin-20"></div>
{{ block.text }}
LEARN MORE
</div>
等…
残念なことに、このメソッドは、コードファイルの外側でループされているため、何度もカウントされないため動作しません。
私の説明が私が達成したいと思っていたものの十分なものであることを望みます。 誰かがおそらく解決策を知っていますか?
あなたの時間をありがとう。
Tom
Bauer の回答は、私の質問ここをクリックしてください。
あなたは遠く離れていません。変数を設定して、ネオ・ループのブロック数を数える必要があります。次に、カウンタ変数に応じてループ内のif文を使用します。
もう1つのオプションは、columnWidthドロップダウンフィールドを追加し、2〜3のいずれかを選択するオプションを与え、値はcss(2
= col-sm-6,3 = col-sm-4)です。
コードコードは次のようになります。
{% block blockContent %}
{% for block in entry.body %}
{% switch block.type.handle %}
{% case 'serviceItem' %}
<div class="{{ block.columnWidth }} margin-20 wow fadeInUp" data-wow-delay="0.4s">
<div class="text-center margin-20"></div>
{{ block.text }}
LEARN MORE
</div>
{% endswitch %}
{% endfor %}
{% endblock %}