web-dev-qa-db-ja.com

views-view-fields.html.twigをhtmlコンテナー要素でラップする方法は?

画像フィールドのあるブロックビューがあります。

私はこの分野をテーマにする方法を知っています:

views-view-fields—my-images.html.twig

このループを次のような要素でラップするにはどうすればよいですか:<div class="slider-article">

私は成功せずにさまざまなソリューションを試しました。

ブロックのテーマtwigテンプレート:

block--views-block--slider-images.html.twigを使用する場合

もちろん、このtwigテンプレート内のフィールドにテーマを設定する可能性がないため、機能しません。

ビューのヘッダーとフッターのオプションにラッパーを追加しようとしましたが、機能しても、htmlをより適切に制御する必要があるため、完璧ではありません(滑らかなスライダーを使用しているので、モジュールですが、使用したくありません)。

私はノードでできることをしようとしています:

node—lorem.html.twig内:

{{ content.field_my_images }}

field--field-my_images.html.twig

<div class="slider-article">

    {% for item in items %}

        <div>

            {{ item.content }}

        </div>

    {% endfor %}

</div>

また、すべての「結果の書き換え」オプションを確認しましたが、ラッパーを追加できませんでした。

ループを使用して上記の例のようにカスタムhtml構造を作成できるソリューションを好みます。

[〜#〜]編集[〜#〜]

ここに私が必要とするHTML構造があります:

<!-- How can I add this wrapper ? -->
<div class="slider-article">
  <!-- views-view-fields--[view-name]--[machine-name].html.twig starts here ! -->
  <div>your content</div>
  <div>your content</div>
  <div>your content</div>
  <!-- END OF views-view-fields--[view-name]--[machine-name].html.twig -->
</div>
1

オプション1

コアviews-view.htmlから(コード全体)をコピーして、テーマのテンプレートフォルダーに貼り付け、名前を変更views-view-[view-name] .html.twigしてから、このテンプレートファイルにクラスを追加します。

{{ rows }}

<div class="slider-article">
{{ rows }}
</div>

オプション2

コア views-view-fields からコピーして、テーマのテンプレートフォルダーに貼り付け、名前を変更しますviews-view-fields-[view-name] .html。小枝

次に、{% for field in fields -%}の前にクラス付きのdivを追加し、{%- endfor %}の後に終了タグを追加します

オプション3(たぶん)

「なし」をクリックすると、ビューUIから追加できます。ただし、これにより、ビュー全体にラッパーが追加されます。

enter image description here

1
No Sssweat