これは Craft CMS Advent Calendar 2022 15日目の記事です。

先日のエントリで、フィールドの入れ子的な話を少し書いた。

現状では Craft CMS のデフォルトではできないが、プラグインを使うことである程度要望を満たすことはできる。
Neo と Super Table あたりがその筆頭。

Neo
https://plugins.craftcms.com/n...

Super Table
https://plugins.craftcms.com/s...

先日書いた中でも出した、 Vizy も今だと選択肢には入ってくると思う。

Vizy
https://plugins.craftcms.com/v...

自分で設計するときに「これらのプラグインを毎回使うか」というとそういうわけでもない。
これらは便利なのだけど、やはり初見でわかりづらくなりがちなところがあったりするし、ページ管理ツールに近くなってしまうのが若干気になる所でもある。

HTMLを書かなくて良いため、HTMLに関するスキルは不要かもしれない。
とはいえ用意された管理画面を使いこなすためのスキルと、それがどういう風な形になるか？をイメージできる必要がある。

作りたいものについてはっきりとしたイメージがあって、それを自由に作りたいなら STUDIO とかでやった方がお互いハッピーなんじゃないかとは思う。

なので、どこまでやるかは塩梅次第ではあるのだが、、、

Craft CMS でやるのであればやり過ぎないようにしているというのが、これらのプラグインを毎回使っていないというところにもなる。
ある程度制約は設けつつ、デザインされたものを破綻せず使う為のルールと考えているところがある。

とはいえそれだけだと Craft の柔軟さが伝わらないし「プラグインで拡張した例」ということで、先日あったようなフィールドの入れ子を、Neoプラグインで構築してみる。

まずはシンプルなパターン。

あらかじめ用意したフィールドを積んでいくことができる。
Craft CMS デフォルトの Matrix フィールドと考えてよい。

複数のフィールドを組み合わせて1つのフィールド（ブロック）として定義して、1セットで入力することもできる。

先ほどの「ボタン」のブロック例。

タブを分けることでテキストとかのデータとは別にclass名などを設定値として持たせるような使い方もできる。

レイアウト的な構成を想定したブロックを用意することで、あらかじめ用意したブロックを入れ子で利用することができる。

ブロック「セクション」に、ブロック「カラム」を入れ子にして複数登録できるようにする。
そのカラムには見出しやテキスト、ボタンといったフィールド（ブロック）を入れ子にして複数入れることができる。

カラムごとの幅やclass指定といった設定値を持つためのフィールドを設定することもできる。

複数カラムのレイアウトは%指定で定義するのが使いやすいのか、Gridの数値を指定するのがいいのか、あらかじめカラム数を決め打ちにしておいて、そこに入れた数で判断するのがいいのか、とか判断材料は多い。

画像とテキストみたいなレイアウトパターンの場合は基本的に1:1の幅で考えておいてもいいかもしれないが、画像が小さ目のときは 1:3 位の幅にしたい時にカラムの幅を指定してやれる方が使いやすいのか、あらかじめ画像とテキストを登録できるようにしておいて、画像幅を自由に指定できるようにした方が使いやすいのか。

結局のところは情報設計やコンテンツのパターンとデザイン次第なところではあるように思う。
なので、CMS部分を担当するとしても、デザイナー、フロントエンドエンジニアと協力しながら設計して、使いやすい CMS を提供していきたい、と改めて。