CMSプロパティは、CMSアイテムに追加できる関連情報です。
アイテムごとに、テキスト、画像、数値、色、セレクトなどのさまざまな情報を柔軟に追加して、デザインエディタ上でデザインや構成に活用できます。
モデルを参照してプロパティとして登録する機能(参照プロパティ)で他モデルとリレーションを構築し、動的に紐付けることも可能です。
Tips: ライター情報、タグ、カテゴリーなどの属性ごとに一覧ページを作成したい場合には、参照プロパティの活用が必須です。
Point: Studio CMSとは
Studio CMSは、Studio上で利用できるCMS(Content Management System)機能です。
仕組みや概要については、以下のヘルプ記事をご覧ください。
プロパティの種別と必須プロパティ
Studioで利用できるプロパティの種別と、あらかじめ用意されている必須プロパティを説明します。
プロパティ種別一覧
Studioで利用できるプロパティの種別は以下の11種類です。詳細は、後述のプロパティ種別の詳細を参照してください。
プロパティ種別 | 説明 |
テキスト | 自由な文字情報(概要や補足説明、URLなど)を保存するプロパティです。 |
リッチテキスト | 記事の作成に特化しており、マークダウン記法で見出しの設定や画像、コードなどを挿入できるプロパティです。必要に応じて、一つのアイテムに複数のリッチテキストを追加できます。 |
画像 | 画像を登録するプロパティです。カードデザイン用の画像など、任意の用途に合わせて追加・削除できます。 |
動画 | 動画を登録するプロパティです。動画をCMSアイテムごとに管理し、動画ボックスと紐付けて表示できます。 |
PDFファイルを登録するプロパティです。製品カタログやセミナー資料などをCMSアイテムごとに管理し、ダウンロードリンクとして利用できます。 | |
数値 | 価格や並び順、数値のIDなど、数値情報を保存するプロパティです。ソートや条件分岐に利用できます。 |
セレクト | あらかじめ登録した候補から1つだけ選択するプロパティです。ステータス風のラベルや種別の管理に向いています。 |
マルチセレクト | 登録済みの候補から複数選択できるプロパティです。タグや複数カテゴリの紐付けに利用します。 |
ブール値 | ON/OFFや有無などを管理する真偽値のプロパティです。フラグ的な情報(例:目立たせる、ピックアップ対象 など)を表現できます。 |
カラー | カラーコードなど色に関する情報を保存するプロパティです。カテゴリごとの色分けや、デザインと連動した表示に使えます。 |
参照 | 他のCMSモデルのアイテムを紐付けるためのプロパティです。カテゴリとの紐付けや、関連記事・関連商品などの関係性を表現できます。 |
必須プロパティ
CMSプロパティには、Studioがあらかじめ用意して削除できない「必須プロパティ」があります。必須プロパティは、CMSアイテムの基本情報や挙動に関わるシステム定義のプロパティです。
Point:「本文」と「アバター」は、それぞれ記事タイプモデルとユーザータイプモデルにのみ含まれる必須プロパティです。
プロパティ名 | 説明 |
CMSアイテムの公開状態を管理するプロパティです。「下書き」「公開中」「変更あり」「公開予約中」の4種類のスタータスがあります。 | |
タイトル | CMSアイテムを識別する名前として常に表示されるプロパティです。 |
公開ページのURL末尾として使用する一意の文字列です。通常は各CMSアイテムごとに自動生成されますが、必要に応じて変更が可能です。 | |
CMSアイテムが公開サイトで閲覧可能になる日時を設定するプロパティです。 | |
最終更新 | CMSアイテムが最後に更新された日時を示すプロパティです。編集操作に応じて自動的に更新され、ユーザーが直接変更や削除を行うことはできません。 |
本文 | 記事タイプモデルのアイテムにデフォルトで設置されているリッチテキストプロパティです。プロパティ名があらかじめ「本文(Body/Contents)」に設定されています。 |
アバター | ユーザータイプモデルにのみ含まれるプロパティです。ユーザーのアバター画像(Avatar)を登録するために使用します。 |
CMSプロパティを追加する
Tips:追加したプロパティをページに表示するには、エディタ上でボックスにデータを紐付ける操作が必要です。詳しくは、動的ページ > CMSデータの紐付けをご覧ください。
任意プロパティは以下の手順で追加します。
画面左のモデル一覧から、プロパティを追加したいモデルを選択します。
アイテム一覧画面で[+]をクリックして、プロパティの種類を選びます。
プロパティのラベルを編集し、追加をクリックします。
各アイテムごとにプロパティの値を設定します。
アイテムの詳細編集画面でも、同様にプロパティを追加できます。
CMSプロパティの値を編集する
画面左のモデル一覧から、対象のモデルを選びます。
CMSアイテム一覧画面で、対象のプロパティの値を編集します。通常のプロパティ:アイテム一覧または詳細画面で直接編集が可能です。
参照プロパティ:プロパティ自体の編集は参照元のモデルで行います。
セレクト / マルチセレクトプロパティの値を削除する場合には、[×]をクリックして解除します。
アイテムを更新します。
公開中のアイテムで、プロパティ項目の編集や設定を解除すると、ステータスが「更新あり」になります。公開サイトへ変更を反映するには、アイテムのステータスを更新する必要があります。
アイテムの詳細画面でも同様の操作が可能です。
プロパティラベルの編集と削除
画面左のモデル一覧から、対象のモデルを選びます
アイテム一覧画面で、編集したいプロパティのラベルをクリックします。
リストメニューで、以下の操作が可能です。
ラベル名の編集
セレクトプロパティやマルチセレクトプロパティの値選択
プロパティの非表示
プロパティの削除(プロパティ自体を削除すると元に戻すことができません。)
アイテムの詳細画面でも同様の操作が行えます。
プロパティ種別の詳細
1. テキストプロパティ
テキストプロパティは、文字列を登録できるプロパティです。
1行表示と複数行表示を選択できます。改行設定は、後からプロパティ設定画面で切り替えが可能です。
ユースケース
記事のサブタイトルとして表示
商品の説明文を表示
外部リンクのURLを登録
設定方法
プロパティ追加時に[改行なし]または[改行あり]を選択します。
テキストを入力して保存します。 改行ありの場合:Shift/Option + Returnで改行(WindowsではShiftまたはAlt)できます。
注意:改行ありからなしへ切り替える際、CMSダッシュボード上だけ改行箇所に<br> が表示され、エディタ・ライブプレビュー・公開サイト上では改行されたままになります。 必要に応じて、文字列 <br>を手動で削除してください。
URLとしてテキストプロパティを活用している例:
2. リッチテキストプロパティ
リッチテキストプロパティは、見出しや段落、箇条書き、リンクなどの書式付きテキストをマークダウン記法で登録できるプロパティです。必要に応じて画像や動画、PDFファイルなども同じプロパティ内に追加・配置できます。
編集方法の詳細は、CMSプロパティ:リッチテキスト(本文)を参照してください。
ユースケース
記事の本文やコラムなど、長文コンテンツを1つのプロパティで管理する
FAQやヘルプ文書などで、見出しと本文、箇条書きを組み合わせて構造化された文章を作成する
3. 画像プロパティ
画像プロパティは、アップロード画像が追加できるプロパティです。
アップロード可能な画像の形式は、Studioエディタにアップロード可能なファイル形式やサイズをご覧ください。
ユースケース
記事ごとにアイキャッチ画像を表示
商品ごとに写真を表示
ライターのアイコンとして表示
4. 動画プロパティ
動画プロパティは、動画ファイルを登録するためのプロパティです。登録したプロパティは、エディタ上で動画ボックスに紐付けて表示できます。
アップロード可能な動画の形式や容量の上限については、アップロード可能なファイル形式と容量制限を参照してください。
ユースケース
事例紹介ページで、インタビュー動画を記事アイテムごとに表示する。
プロダクト紹介ページで、使い方やデモ動画を記事アイテムごとに表示する。
5. PDFプロパティ
PDFプロパティは、PDFファイルを登録するためのプロパティです。
CMSアイテムごとに異なる資料やドキュメントを登録し、ページ上からダウンロードリンクとして利用できます。
通常ページと同様に、ページ上に直接PDFの内容を表示することはできません。
ユースケース
製品ページで、製品仕様書やカタログのPDFをダウンロードリンクとして掲載する。
セミナー情報ページで、当日の配布資料やスライドのPDFを共有する。
採用ページで、会社案内資料や募集要項のPDFを提供する。
6. ブール値プロパティ
ブール値プロパティは、オン・オフ(true / false)が設定できるプロパティです。
ユースケース
「新着」バッジの表示・非表示(表示条件を併用)
「おすすめ」商品のマーク付け(表示条件を併用)
特定コンテンツのスタイル(色やサイズなど)変更(条件付きスタイルを併用)
設定方法
プロパティ追加時に[ブール値]を選択します。
わかりやすいラベル名を設定(例:「新着表示」「おすすめ商品」)します。
アイテムごとにオン・オフを設定します。
関連記事
7. 数値プロパティ
数値プロパティは、数字を追加できるプロパティです。
ユースケース
値段を入力し、エディタの絞り込み機能で3,000円以下の商品のみ表示する
商品のサイズを入力し、エディタの絞り込み機能で100cm~500cmの商品のみ表示する
設定方法
プロパティ追加時に[数値]を選択します。
アイテムごとに数値を入力します。
8. カラープロパティ
色(カラーコード)を設定できるプロパティです。登録したカラープロパティは、ボックスの塗り、テキストボックスの色(文字色)として利用可能です。
ユースケース
カテゴリーごとの色分け
タグの背景色設定
設定方法
プロパティ追加時に「カラー」を選択します。
カラーピッカーまたはカラーコードを入力して色を選択します。
「決定」で保存します。
注意:
グラデーションは設定できません。
CMSダッシュボードからお気に入りパレットへの追加や削除はできません。
9. セレクトプロパティ
セレクトプロパティは、登録済みのオプションから1つの項目を選択できるプロパティです。アイテムのカテゴリ分けやタグ表示に活用できます。
CMSリストでフィルター条件として単一の項目を指定し、アイテムを絞り込むことが可能です。
参照プロパティとは異なり、スラッグ(固有のURL)を持たないためセレクトプロパティを使って独立したページパスを作成することはできません。
セレクトプロパティは、ダイナミックフィルター(Dynamic) として選択することはできません。
カテゴリーやタグで動的にフィルタされた一覧ページが必要な場合は、参照プロパティの使用をご検討ください。
ユースケース
イベント情報のお知らせ記事で、イベントごとの参加方法として「要予約」「予約不要」の単一ラベルを付ける(ラベルごとの記事一覧ページは作成しない場合)
設定方法
プロパティ追加時に[セレクト]を選択します。
選択肢を登録します。
アイテムごとに1つの項目を選び、設定します。
10. マルチセレクトプロパティ
マルチセレクトプロパティは、登録済みのオプションの中から複数の項目を選択できるプロパティです。
CMSリストのフィルター条件を使って、一度に複数の条件で絞り込みを行う場合に活用できます。絞り込み条件には、最大5つのプロパティ項目(and検索)が設定できます。
CMSリストでフィルター条件として複数の項目を指定し、アイテムを絞り込むことが可能です。
参照プロパティとは異なり、スラッグ(固有のURL)を持たないためセレクトプロパティを使って独立したページパスを作成することはできません。
セレクトプロパティは、ダイナミックフィルター(Dynamic) として選択することはできません。
カテゴリーやタグで動的にフィルタされた一覧ページが必要な場合は、参照プロパティの使用をご検討ください。
ユースケース
採用ページに業務内容として「人事」「経理」などの複数ラベルを表示する(ラベルごとの記事一覧ページは作成しない場合)
ポートフォリオサイトで「グラフィック」「Webサイト」などの複数ラベルを表示する(ラベルごとの記事一覧ページは作成しない場合)
設定方法
プロパティ追加時に[マルチセレクト]を選択します。
選択肢を登録します。
アイテムごとに必要な項目を複数選択します。
サイト上とダッシュボード内での表示順がドラッグ&ドロップで編集できます。 上部の項目はサイト上の表示順で、下部はダッシュボード内での表示順です。
11. 参照プロパティ
参照プロパティはアイテムに直接追加するプロパティとは異なり、他のモデルのアイテムを参照できるプロパティです。シングルセレクト(1つ)とマルチセレクト(複数)から選択できます。
プロパティ自体にスラッグ(固有のURL)などの付属情報が設定できるため、独立したページパスを作成したり、プロパティ項目ごとに画像やテキストを追加表示することができます。
カテゴリーやタグで動的にフィルタされた一覧ページの作成が可能です。
CMSリストのフィルター条件に単一または複数の項目を指定して、アイテムを絞り込むことが可能です。マルチセレクトの場合、最大5つのプロパティを条件(and検索)に絞り込みが設定できます。
ユースケース
記事にライター情報(画像や名前など複数の情報)を掲載する
タグやカテゴリーを表示する(タグやカテゴリーごとに記事一覧ページも作成する場合)
設定方法
プロパティ追加時に[モデルを参照]から、モデルを選択します。
シングルセレクト・マルチセレクトのいずれかを選びます。
アイテムごとに参照アイテムを選択します。
参照プロパティは追加時にシングルセレクトかマルチセレクトを選択します。後からセレクト設定を切り替えることはできないため、シングル・マルチを切り替えたい場合はプロパティの作り直しが必要となります。
シングルセレクトとマルチセレクトの違い
シングルセレクト:
1つのアイテムのみ参照可能
テキストや画像ボックスに紐付け可能
マルチセレクト:
複数のアイテムを参照可能
リストにのみ紐付け可能
property reference

















