メインコンテンツにスキップ
すべてのコレクションよくある質問CMS
CMS カラープロパティを使ってCMSリスト内アイテムごとに色を変える方法
CMS カラープロパティを使ってCMSリスト内アイテムごとに色を変える方法

Studio CMSのモデルに追加する「カラープロパティ」を利用してアイテム毎に表示する色を管理・設定する方法をご紹介します。

Saika avatar
対応者:Saika
2か月以上前に更新

CMSリスト内アイテムごとに色を変える方法

この記事では、Studio CMSのカラープロパティを活用して、アイテムごとに個別の色を設定する方法を解説します。特定のカテゴリーやタグに基づいて異なる色を表示するシーンなどでご活用いただけます。

※ここで紹介する手順は参照モデル側で色を設定していますが、モデルに直接カラープロパティを追加してもアイテム毎に色を変えることが可能です。

手順

  1. モデルとアイテムを追加する

    CMS ダッシュボードへアクセスし、モデルを新規作成します。そのモデルにアイテムを追加します。

    CMSモデルとアイテムを追加する画面

  2. 色を管理する別モデルとアイテムを追加する

    色などの情報を管理するモデルを新規作成します。そのモデルにアイテムを追加します。

  3. カラープロパティを追加する

    「+」ボタンからカラープロパティを追加します。アイテムごとに異なる色を指定します。

    カラープロパティに

    カラープロパティをボックスの塗りに紐づける様子

  4. 参照プロパティを追加する

    先ほど作成したモデルを参照し、シングルセレクトで追加します。

    ※マルチセレクトではうまく機能しませんので、ご注意ください。

    参照モデルをとシングルセレクトを選択している画面

  5. カラープロパティをボックスの塗りに設定する

    エディタへ移動し、カラープロパティを設定したいボックスをクリックします。レイヤーパネルからカラープロパティを選択し、塗りにドラッグアンドドロップします。

    カラープロパティをボックスの塗りへ紐づける様子

    これで完成です。

こちらの回答で解決しましたか?