StudioのCMS(Contents Management System)は、ノーコードで直感的にWebサイトのコンテンツ管理とデザインを一体化できる仕組みです。以下に、その特徴や構造、デザイン方法についてまとめます。

Studio CMSの基本構造

Studio CMSは主に以下の3つの要素で構成されています。

  • モデル
    コンテンツの種類ごとにグループ化する「箱」の役割。例:ブログ記事、作品、メンバーなど。
  • アイテム
    モデル内に格納される1つ1つのデータ(記事やユーザーなど)。各アイテムはモデルに必ず所属します。
  • プロパティ
    アイテムに紐付く具体的な情報(タイトル、本文、画像、公開日など)です。

これらを組み合わせて、Webサイト上のさまざまなコンテンツを柔軟に管理できます。

デザインとCMSの連携

Studioでは、デザインエディタCMSダッシュボードの2つの画面で作業します。

  • デザインエディタ
    サイトのレイアウトや見た目を自由に設計できるエディタ。テキストや画像などの「ボックス」をドラッグ&ドロップで配置し、色やサイズも直感的に調整可能です。
  • CMSダッシュボード
    モデル・アイテム・プロパティを管理する画面。ここで登録したコンテンツを、デザインエディタで作ったレイアウトに流し込む形で表示できます。

ポイント:
デザインとコンテンツが分離されているため、同じデザインを使い回しつつ、内容だけを簡単に更新・追加できます。たとえば、ブログ記事やお知らせ、作品紹介など、更新頻度の高いページに最適です。

CMSページの作成手順

  1. プロジェクト作成
    サイト単位で「プロジェクト」を立ち上げます。
  2. CMS機能の有効化
    CMSダッシュボードで「CMSをはじめる」を選択し、モデルやテンプレートを設定します。
  3. モデル・アイテムの追加
    例:ブログモデルを作成し、記事アイテムを追加。各アイテムにタイトルや本文、画像などのプロパティを設定します。
  4. デザインエディタでレイアウト作成
    ページ内にボックスを配置し、CMSのデータを紐付けます。動的リストや動的ページとして複数のコンテンツを一括表示可能です。
  5. 公開・更新
    CMSダッシュボードからコンテンツを追加・編集すると、デザインエディタに自動反映され、ワンクリックで公開できます。

Studio CMSの主な特徴

  • ノーコードで構築・運用が可能
  • デザインとコンテンツ管理が完全に分離されている
  • 複数人でのリアルタイム共同編集や公開予約ができる
  • SEO対策や外部サービス連携もサポート
  • WordPressからの移行も容易

まとめ

StudioのCMSは、モデル・アイテム・プロパティというシンプルな構造で、デザインとコンテンツ管理を分離しつつも一体化した操作性を実現しています。ノーコードで直感的にサイトを構築・運用でき、特に更新頻度の高いWebサイトやブログ、ニュースページなどに最適なCMSです

カテゴリー: WEB