CMSリスト内アイテムごとに色を変える方法
この記事では、STUDIO CMSのカラープロパティを活用して、アイテムごとに個別の色を設定する方法を解説します。特定のカテゴリーやタグに基づいて異なる色を表示するシーンなどでご活用いただけます。
※ここで紹介する手順は参照モデル側で色を設定していますが、モデルに直接カラープロパティを追加してもアイテム毎に色を変えることが可能です。
手順
モデルとアイテムを追加する
CMS ダッシュボードへアクセスし、モデルを新規作成します。そのモデルにアイテムを追加します。
色を管理する別モデルとアイテムを追加する
色などの情報を管理するモデルを新規作成します。そのモデルにアイテムを追加します。
カラープロパティを追加する
「+」ボタンからカラープロパティを追加します。アイテムごとに異なる色を指定します。
参照プロパティを追加する
先ほど作成したモデルを参照し、シングルセレクトで追加します。
※マルチセレクトではうまく機能しませんので、ご注意ください。
カラープロパティをボックスの塗りに設定する
エディタへ移動し、カラープロパティを設定したいボックスをクリックします。レイヤーパネルからカラープロパティを選択し、塗りにドラッグアンドドロップします。
これで完成です。