こんにちは!ディレクターの西前です。
今年の8月に入社し、初めて Drupal に触れた初心者です。
初のブログは、Drupal について学ぶ中でつまずいた、Views のリレーションシップとコンテクスチュアルフィルターについてまとめてみたいと思います。
そもそも Views の使い方が分からない!という方は下記もあわせてお読みください。
Viewsをサクッと作る3つのコツ

こちらの記事は、Drupal Advent Calendar 2023 へ寄稿します。
Drupal に関する様々な記事を読むことが出来ますので、ぜひご覧ください!

「リレーションシップ」・「コンテクスチュアルフィルター」とは何か

まずは大枠を捉えていきましょう。

「リレーションシップ」はテーブルを結合するもの

SQL で言う「JOIN」に相当するものです。
例えば、「コンテンツ」を使用して作成したビューでは、コンテンツで保持している要素しか表示が出来ません。
そこで、リレーションシップを使用することで、他のエンティティ(例:ユーザーエンティティ)の情報が参照出来るようになります。

「コンテクスチュアルフィルター」は情報を絞り込むもの

SQL で言う「WHERE」に相当するものです。
「コンテキスト(context)」は「文脈、前後関係、事情、背景、状況」の意味を持つ単語であることから、URL のパラメーターや URL から取得できるコンテンツの ID などの文脈から得られる情報を使用して、情報を絞り込めることが分かります。

どう使うのか

大枠が分かったところで、実際に使用してみましょう。

「リレーションシップ」を使用してユーザーエンティティの情報を表示する

記事を投稿したユーザーのアイコンを、Views で作成した記事の一覧に掲載してみます。

まず、記事の一覧を作成します。
スクリーンショット 2023-11-21 15.04.27.png

「フィールド」を追加します。
投稿者情報からアイコンを表示したいのですが、この時点では選択肢に出てきません。
スクリーンショット 2023-11-21 15.04.27.png

そこでリレーションシップの登場です!
「記事」コンテンツの持っている情報にユーザーアイコンはありません。
この情報を持っているのは「ユーザーエンティティ」であり、リレーションシップを組むことで情報を参照出来るようになります。

リレーションシップを組んでみます。

「高度」タブを開き、リレーションシップを追加します。
スクリーンショット 2023-11-21 15.14.08.png

「ユーザー」を選択します。
スクリーンショット 2023-11-21 15.28.22.png (121.6 kB)

再度「フィールド」の追加を選択すると、カテゴリにユーザーが追加されています!
スクリーンショット 2023-11-21 15.30.31.png (35.8 kB)

「ユーザー」の「描画されたエンティティ」を選択すると…
ユーザーアイコンが表示されました!
スクリーンショット 2023-11-21 15.39.07.png (33.7 kB)

「コンテクスチュアルフィルター」使用して関連する記事を表示する

現在閲覧している記事に関連する他の記事を表示してみます。
今回は同じタクソノミータームを持つ記事を、関連記事とします。

あらかじめ、記事にはタグ(タクソノミーターム)を設定しています。
スクリーンショット 2023-11-21 16.10.10.png (5.8 kB)

まずは、記事一覧の作成です。
この時点では、全ての記事が一覧として出ている状態です。
スクリーンショット 2023-11-21 16.13.39.png (30.7 kB)

「高度」タブを開き、コンテクスチュアルフィルターを追加します。
スクリーンショット 2023-11-22 16.01.31.png (32.7 kB)

「タクソノミーターム ID を含む」を選択します。
スクリーンショット 2023-11-22 15.53.36.png (128.0 kB)

詳細な設定は、下記の通りです。
ノードに紐づくタクソノミータームの ID で絞り込みます。
スクリーンショット 2023-11-22 16.10.44.png (203.0 kB)スクリーンショット 2023-11-22 16.16.54.png (140.0 kB)

このままでは、現在閲覧している記事も一覧に出てきてしまうため、もう 1 つコンテクスチュアルフィルターを追加します。
上記のコンテクスチュアルフィルターで抽出されたデータを更に絞り込むイメージです。
スクリーンショット 2023-11-22 16.18.51.png (83.7 kB)スクリーンショット 2023-11-22 16.19.31.png (78.3 kB)

実際に記事にブロックを配置して確認してみると…
滋賀店に関する記事だけが表示されました!
スクリーンショット 2023-11-22 16.21.06.png (104.1 kB)

「リレーションシップ」と「コンテクスチュアルフィルター」でコンテンツに関連する記事を表示する

最後は、2 つを合わせて使用する方法をご紹介します。
基本的に、リレーションシップとコンテクスチュアルフィルターは合わせて使われることが多いです。

コンテンツの中に、関連する記事を表示させてみます。

あらかじめ、記事には関連するコンテンツを設定しておきます。
スクリーンショット 2023-11-22 16.36.44.png (80.2 kB)

まずは Views で記事の一覧を作成します。
スクリーンショット 2023-11-22 16.39.05.png (78.7 kB)

リレーションシップを組みます。
これにより、記事の「関連する店舗」に設定されたコンテンツが参照出来るようになります。
スクリーンショット 2023-11-22 16.41.36.png (137.0 kB)

コンテクスチュアルフィルターを追加し、「ID」を選択します。
スクリーンショット 2023-11-22 16.39.46.png (141.5 kB)

「リレーションシップ」に、先ほど参照したフィールドを設定します。(画像 ①)
また、閲覧しているコンテンツのノード ID (URL の/node/num の部分)で表示する記事を変えるために、タイプは「URL から取得したコンテンツ ID」に設定します。(画像 ②)
スクリーンショット 2023-11-22 16.51.37.png (179.8 kB)

コンテンツに、作成したブロックを配置してみると…
東京店舗に関連する記事だけが表示されました!
スクリーンショット 2023-11-22 16.57.39.png (88.5 kB)

まとめ

一見少し取っ付きにくいリレーションシップとコンテクスチュアルフィルターですが、使用することで Views の可能性がぐっと広がることが分かりました。
これからも初心者目線の記事を書いていけたらと思うので、よろしくお願いいたします!


共に働く新しい仲間を
募集しています

スタジオ・ウミは「Drupal」に特化したサービスを提供する Drupal のエキスパートチーム。
フルリモート&フレックス制だから、働く場所を選ばず時間の使い方も自由です。
そんなワークライフバランスの整った環境で、当ブログに書かれているような
様々な技術を共に学びながら、Drupalサイト開発に携わってみたい方を募集しています。
まずはお話だけでも大歓迎!ぜひお気軽にご連絡ください。