この記事では、Studio CMSを使ってコンテンツを管理するときに必要な設定と、作成する順番を紹介します。用途（ブログ、お知らせ、メンバー紹介など）によらず共通する骨組みを扱うため、各設定の詳しい操作方法は関連記事を参照してください。
Point: Studio CMSとは
Studio CMSは、Studio上でコンテンツを構造化して管理・更新できるCMS（Content Management System）機能です。
モデルやアイテム、プロパティを組み合わせて、ブログやニュースなどの更新性が高いコンテンツを一元管理します。
Studio CMSの仕組みや概要については、Studio CMSとはを参照してください。
全体の流れ
Studio CMSでコンテンツを構築する際は、次の順番で進めます。
モデルを作成する
アイテムを追加し、プロパティを設定する
動的ページで、記事詳細ページを作成する
通常ページに動的リストを配置する（記事一覧の作成）
ライブプレビューで動作を確認する
公開ステータスを設定する
サイトを公開する
Point：記事詳細ページと一覧ページの違い
記事詳細ページは、Studio CMSで作成した記事コンテンツ1件1件の詳細などを反映するページです。動的ページで作成し、表示したい記事モデルと接続することで、動的に切り替わるページを作成できます。
この2つは役割が異なるため、別々に作成する必要があります。
手順1. モデルを作成する
コンテンツの構造を定義するモデルを、CMSダッシュボードで作成します。
記事コンテンツを作成する場合には、記事作成に特化した記事タイプモデルを作成します。
詳しい手順は、CMSモデルを参照してください。
手順2. モデルにアイテムを追加し、プロパティを設定する
モデルにアイテムを追加する
作成したモデルにアイテムを追加します。詳しい手順は、CMSアイテムを参照してください。
プロパティを設定する
アイテムを追加したら、タイトルや本文、カバー画像などのプロパティを設定します。
詳しい手順は、CMSプロパティ、CMSダッシュボードでCMS記事アイテムを作成するを参照してください。
Point：モデル名を確認する
次の手順で動的ページを作成する際に、このモデル名を指定します。CMSモデルが複数ある場合には、接続したいモデル名を控えておきます。
手順3. 動的ページで、記事詳細ページを作成する
動的ページで、CMS記事モデルをアイテムごとに表示する記事詳細ページを作成します。
1つの動的ページで、複数のアイテムを同一デザイン内で切り替えて表示できます。
動的ページを追加する
デザインエディタに移動し、対象のCMSモデルを接続した動的ページを追加します。
詳しい手順は、動的ページを参照してください。
ボックスを追加して、プロパティと紐付ける
ページで表示したいプロパティの種別に合ったボックスを追加した上で、ボックスとプロパティの紐付けをします。
詳しい手順は、デザインエディタで、ボックス要素とCMSプロパティを紐付けるを参照してください。
手順4. 通常ページに動的リストを配置する（記事一覧の作成）
動的リストを追加する
手順3で作成した記事詳細ページへの動線となる、記事一覧を作成します。通常ページに、記事詳細ページと同じCMSモデルを接続した動的リストを配置します。
詳しい手順は、動的リストを参照してください。
リスト内のボックスとプロパティを紐付ける
ボックスとプロパティを紐付けてコンテンツを反映します。
slugプロパティで記事詳細ページへのリンクを設定することで、リストから記事詳細ページへ遷移する記事一覧として機能します。。
詳しい手順は、静的なリスト／カルーセル内のボックスにプロパティを紐付ける、CMSリストからCMS記事ページへのリンクを設定するを参照してください。
手順5. ライブプレビューで動作を確認する
動的ページと一覧ページを作成したら、公開前にライブプレビューで動作を確認します。一覧ページから動的ページへのリンクが正しく機能しているか、複数のアイテムで表示が意図どおりに切り替わるかを確認してください。
手順6. 公開ステータスを設定する
アイテムごとに公開ステータスを設定します。ステータスが[公開中]のアイテムのみ、公開サイトに表示されます。
詳しい手順は、CMSプロパティ：ステータスと公開日時を参照してください。
手順7. サイトを公開する
CMSコンテンツを含め、サイト全体の調整が完了したらサイトを公開します。
詳しい手順は、独自ドメインでサイトを公開するを参照してください。
Studio CMSについて動画で学ぶ
以下の動画でも、Studio CMSを使用してお知らせ記事を公開するまでの手順を詳しく解説しています。
CMS blog 記事 ブログ 新規作成 動的ページ