Craft CMS

DATE 2019.09.03 | UPDATE 2019.09.04

製品比較的なコンテンツ例

いくつかデータを管理していて、それらを比較したコンテンツを管理するサンプルです。

目次

  1. 掲載コンテンツイメージ
  2. 管理画面イメージ
  3. 実装内容

掲載コンテンツイメージ

掲載コンテンツのイメージです。

管理画面イメージ

管理画面側のイメージです。

比較表コンテンツ

比較表コンテンツサンプル

比較表に表示する項目の選択

選択した表示項目

表示項目フィールドの設定

値は扱いやすさを考慮して製品データ側のフィールドに揃えています

製品選択

表示する製品の選択をします

実装内容

前提:比較表コンテンツと製品コンテンツの関係

このサンプルでは製品をあらかじめ製品ごとにデータ(エントリ)として管理していて、それを比較表のコンテンツとしても使いたいという想定になります。

そのため比較表というページは複数作成される想定で、それぞれで選ぶ製品も異なっています。

それを踏まえて比較表コンテンツ用の箱(セクション)を用意してそこに比較表ページのデータ(エントリ)を投稿していきます。

比較する製品を選択する

選んだ製品を比較表のコンテンツとして掲載することで、製品の情報自体は製品側のデータとして一元管理が可能です。

比較表示する項目の選択

また比較する内容によっては製品情報の内容のうちどれを表示するか?ということがかわりますので、それについても設定、並び順の制御を出来るようにしました。

製品の並び順設定

製品の並び順は製品選択(Matrix、行列)フィールドの機能で設定が可能です。

製品選択に加えて、比較表のページごとに各製品に1項目自由に入力できる欄(キャプチャ内の自由テキスト欄)を設けました。

これ自体は製品側のデータにもたせるのではなく、比較表ページ側のそれぞれの製品のコンテンツの1つという位置づけで管理しています。
複雑にはなりますが複数持たせることも可能です。

製品選択(エントリ選択)は複数選択することもできるため、自由項目がない要件であればもう少し選択しやすくなります。


拡張例

  • 製品情報で管理している内容と同じ内容を、比較表の表示項目のプルダウンに設定しますが、製品情報側に変更があった場合に手動で対応させる必要がある
  • リッチエディタの表組みで管理するかどうか?

コンテンツ

PAGETOP