EntityにViewsを埋め込むEVAモジュール

アイキャッチ画像 Umi->d

こんにちは。

Drupalでサイト制作を行う際、「あるページの中に関連するコンテンツの一覧を表示したい」という要件がしばしば出てきます。

単純にページの下部に表示するなどであればブロックでも対応できるとは思うのですが、
例えばノードのフィールドとフィールドの間に挟まれる場合などは結構ややこしいですよね。

今回はもっと手軽に、まるでフィールドのように一覧を表示させることができるEVAモジュールをご紹介いたします。

EVAモジュールとは

EVAは正式名称 EVA: Entity Views Attachment というDrupalのコントリビュートモジュールで、ViewsをEntityに添付することができます。
特徴として、

  • DrupalのどんなEntityにも添付できる
  • 添付したViewsの表示位置を表示管理のページから変更できる
  • エンティティのIDやその他の値をViewsに引数として渡すことができる

ということが挙げられています。

インストール

インストール方法は通常のDrupalのモジュールをインストールする方法で、 特別なことは必要ありません。

EVAモジュールを使ってみよう

それでは実際に使用してみます。
今回はデモサイトとして東京オリンピックのサイトを想定して、
会場紹介ページにその会場で行われる競技の一覧を表示します。
コンテンツタイプは、

  • 会場
  • 競技

の2タイプで、競技には会場を参照するフィールド(field_place)が存在します。

まずはじめにViewsを作成します。

ディスプレイの追加ボタンをクリックすると、「EVAを追加」というメニューをクリックします。
もし「EVAを追加」というメニューが無い場合は、EVAモジュールがインストールされていることを確認して、キャッシュをクリアしてください。

ディスプレイの追加

EVAのViews設定画面が表示されますので、まずは「ENTITY CONTENT SETTINGS」の欄の設定を行います。
ここではViewsをどのエンティティに埋め込むかを設定します。

  • Entity type: 埋め込むエンティティの種類を選択します。今回はContentです。
  • バンドル: 埋め込む対象をさらに詳細にに絞ることができます。今回は会場に埋め込みたいので、会場を選択します。
  • 引数: エンティティからこのViewsに渡ってくるパラメータを設定することができます。渡ってきたパラメータはコンテクスチュアルフィルターで使用することができます。
    今回はデフォルトのidのままですが、tokenを使って複数のパラメータを渡すことも可能ですので、必要に応じて使ってみると良いかと思います。
  • Show title: タイトルの表示・非表示を設定します
  • アクセス: このViewsの閲覧権限を設定します

ENTITY CONTENT SETTING欄の設定

これで競技の一覧を会場に埋め込むことができました。
ただし今のままではどの会場をみても全ての競技が表示されてしまいます。

全ての競技が表示されてしまう会場ページ

今回のゴールは、「会場を紹介するページの中に、その会場で開催される競技の一覧を表示する」ことですので、
表示する会場に応じて競技を絞り込む必要があります。
ここで先ほど出てきたコンテクスチュアルフィルターを使用します。

整理すると、field_placeから参照されているコンテンツのIDが、引数として渡ってきたIDと一致する必要があります。
そのため、以下の手順でリレーションの追加とコンテクチュアルフィルターの追加を行います。

  1. リレーションシップの追加で、「field_placeから参照されているContent」を追加します
  2. コンテクチュアルフィルターに「ID」を追加し、リレーションシップに1のリレーションシップを選択します

コンテクスチュアルフィルターの設定

これで無事に会場ごとに開催競技を表示することができました!

開催競技が表示される会場ページ

フィールドの表示管理を見てみるとEVAのフィールドが追加されているのがわかるかと思います。
他のフィールドと同様に順番を並べ替えたり、ビューモードに応じて非表示にしたりなども可能です。

表示管理ページ

まとめ

いかがでしたでしょうか。ページの一部にViewsを表示させる方法は何通りかあるとは思いますが、EVAで生成したViewsはフィールドと同じように扱えるのでレイアウトの幅が広がるかと思います。基本的にはViewsを作成するだけなので設定もそこまで複雑でないのが嬉しいです。皆さんも機会があれば使ってみてください。

コメントを追加

プレーンテキスト

  • HTMLタグは利用できません。
  • 行と段落は自動的に折り返されます。
  • ウェブページのアドレスとメールアドレスは自動的にリンクに変換されます。

Webプログラマー募集 私たちスタジオ・ウミは、共に技術を高め合い、共に価値ある仕事を追求できる仲間を探しています。