こちらの記事では、STUDIOのCMSについて詳しく解説していきます。CMSとして世界的に有名なツールとしてWordPressが挙げられますが、STUDIOのCMSでもブログやオウンドメディアなどの構築や運用にも十分対応できます。今ご覧いただいているページもSTUDIOのCMSを活用して実装しています。

本記事では、STUDIO CMSの特徴から基本的な仕組み、実際の入稿手順までを幅広く説明しました。また、STUDIO CMSを活用した事例やWordPressとの比較についても解説しています。これからSTUDIOを導入しようと考えている方や、WordPressをはじめ既存のCMSからSTUDIOへ移行を検討している方はぜひ参考にしてください。

CMSとは？

CMSとは"Contents Management System"(コンテンツ・マネジメント・システム)の略称で、Webサイトの情報やコンテンツを効率的に管理・更新するシステムです。

例えば、ブログ記事やニュース記事を追加する際、CMSがなければ、新たにコーディングして記事ページを作成しなければなりません。しかし、ブログ記事やニュース記事は同じレイアウトを使用することが多いため、記事の本文とサムネイル画像だけを変更できれば、手間が大幅に削減されます。

そこで、CMSを活用することで、同じレイアウトのページであっても、テキストや画像をコーディングの知識がない人でも簡単に入れ替えたり、新しいコンテンツを追加したりすることができるようになり、Webサイトを効率的に運用できるようになります。

STUDIOとは？

STUDIOとは、Webサイトを制作できる日本発のノーコードツールです。STUDIOは、かなり自由度の高いデザインを実装でき、制作後も運用しやすいため、スタートアップから大企業、官公庁に至るまで、数多くの企業で導入されています。

これまでは、本格的なWebサイトの多くがコーディングをして制作されてきました。しかし、近年では、STUDIOでも十分複雑なデザインや機能を実装することができ、制作後の運用もしやすいため、本格的なサービスサイトやコーポレートサイトでもSTUDIOが活用されるケースが増えています。実際、弊社が運営するNOROSHI Partnersにご依頼いただいたWebサイトの制作は全てSTUDIOで実装しています。

参考記事：ノーコードツールSTUDIOとは？制作会社がメリット・デメリットを徹底解説！

STUDIO CMSの特徴

STUDIO CMSは、使いやすさと機能性が魅力です。以下に、その主要な特徴を簡潔にまとめました。

① リアルタイム共同編集

複数のメンバーがリアルタイムで記事の執筆を行うことができます。複数人でスムーズにコンテンツの編集・管理ができるため、チームでの運用にも適しています。また、コメント機能もあり、記事の執筆からレビューや公開まで、全てSTUDIOのCMS上で行うことができます。

②操作性

STUDIO CMSの管理画面は使いやすく、初心者の方でも運用しやすいです。WordPressと比較しても管理画面のUIが洗練されており、直感的に更新ができます。また、記事エディタはマークダウンに対応しており、記事の執筆もSTUDIO上で行うことができます。

③ 公開予約ができる

ブログなどのメディア運用に便利なコンテンツの公開予約が可能です。

④ WordPressからの移行が簡単

STUDIOではWordPressからのCMSアイテムの移行機能があり、xml形式で書き出した記事やタグを簡単にインポートできます。WordPressで執筆してきた記事を簡単に移行できるため、WordPressからSTUDIOへの乗り換え時も、手間なくCMSを移行できます。

⑤ コレクション機能(記事のキュレーション)

記事のキュレーションが可能で、人気の記事・おすすめの記事など、自由に記事を組み合わせて表示できます。

⑥ SEO対策も十分に可能

STUDIOで制作したサイトもきちんとSEO対策を行えば十分に上位表示を狙うことができます。STUDIOで設定可能な内部対策については参考記事をご覧ください。

参考記事：STUDIOはSEOに弱い？STUDIOで設定すべきSEO対策一覧

⑦役割に応じた権限管理機能

CMSのみを操作可能なライター権限などを役割に応じて付与できるため、チームでも運用がしやすいです。ただし、ライター権限機能を使えるのは、CMSプラン（3名まで）とBusinessプランになります。（2023年3月更新）

STUDIO CMSの基本的な仕組み

STUDIOのCMSの基本的な仕組みについて解説してきます。STUDIOのCMSは、以下の4つの要素を組み合わせて実装できます。

• モデル

• アイテム

• プロパティ

• コレクション

モデル

STUDIOでは、「モデル」という概念が用意されており、CMSで管理するコンテンツ（記事、ユーザーなど）を同じカテゴリーごとにまとめることができます。まずは、ブログやニュース等のモデルを作成し、各モデルの中にブログ記事やニュース記事を格納していきます。モデルの中に追加する各記事などのコンテンツは「アイテム」と呼ばれます。アイテムの詳細については後述します。

モデルは、STUDIOのダッシュボードのCMSから追加できます。モデルを作成する際には、名前とタイプを選択する必要があります。モデル名は、「ブログ」や「ニュース」などCMSで管理したいものの名称を設定しましょう。タイプには、記事タイプ、ユーザータイプ、カテゴリータイプ、カスタムタイプの4つが用意されており、それぞれ異なる目的に応じて選択することができます。モデル名は後からでも変更できますが、モデルタイプは後から変更できないので注意しましょう。

①記事タイプ

記事タイプは、ブログやニュースなどの一般的な記事を管理するのに適したモデルです。マークダウンに対応したリッチテキストで本文を作成できるのが特徴です。長めの本文が必要なモデルを作成する場合に適しています。

②ユーザータイプ

ユーザータイプは、名前やプロフィール画像などの情報を持ち、記事のライターやメンバーの管理に適したモデルです。ユーザー情報を一元管理し、他のモデルと紐付けることができます。

③カテゴリータイプ

カテゴリータイプは、他のモデルのアイテムをカテゴリごとに分類するのに適したモデルです。例えば、ブログ記事やニュース記事のカテゴリタグなどに活用できます。

④カスタムタイプ

カスタムタイプは、タイトルとSlugのみをデフォルトのプロパティとする最もシンプルなモデルです。カスタマイズして幅広い用途で活用できます。特定の目的に限定されない柔軟なモデルとして活用できます。

アイテム

各モデルの中に追加する各コンテンツを「アイテム」と呼びます。例えば、ブログ記事を管理するモデルであれば、各ブログ記事がアイテムにあたります。アイテムは、各モデルの右上の新規追加ボタンから追加できます。

プロパティ

各アイテムに付属する情報を「プロパティ」と呼びます。プロパティには、テキスト、画像、ブール値、カラー、画像などを設定できます。例えば、ブログ記事を管理するモデルでは、各記事のサムネイル画像や説明文などをプロパティとして設定できます。設定したプロパティは、デザインエディタ上で参照できるため、各アイテムについて表示させたい様々な情報をプロパティとして管理できます。

①テキストプロパティ

テキストを設定するプロパティで、改行ありと改行なしを選択できます。また、URLを設定することもできます。

②数値プロパティ

数値を管理できるプロパティです。

③ブール値プロパティ

オン、オフを切り替えられるプロパティで、オンの時のみ表示するコンテンツを作成したり、オンの時のみスタイルを変えたりできます。

④カラープロパティ

カラーを設定できます。設定したカラーを各アイテムの背景色や文字色に設定できます。

⑤画像プロパティ

画像をアップロードできます。ブログやニュース記事のサムネイル画像などで活用できます。

⑥参照プロパティ

他のモデルを参照するプロパティも設定できます。他のモデルを参照することで、各アイテムに他のモデルのアイテムを紐づけられます。例えば、「ブログモデル」で管理している記事に、「ブログカテゴリ」モデルを参照するプロパティを設定することで、各記事にカテゴリタグを紐づけて表示できます。シングルセレクトとマルチセレクトを選択でき、一つのアイテムに複数のアイテムを紐づけることもできます。※シングルセレクトとマルチセレクトは後から変更できないので注意が必要です。

コレクション

コレクションとは、各モデルのアイテムをピックアップして表示させる機能です。ブログの人気記事やおすすめ記事を表示させたい場合などに活用できます。コレクションは、CMSのコレクションの左にある＋ボタンから追加できます。コレクションが参照するモデルを選択し、自由にアイテムを追加できます。

また、通常のモデルは公開日の新しい順に表示されますが、コレクションは自由に表示順を変更することができます。

STUDIO CMSで実際にアイテムを入稿する手順

ここからは、STUDIO CMSを使って実際にアイテムを入稿する手順を説明します。

①アイテムを新規作成

新しいアイテムを作成したい場合は、右上の新規作成ボタンを押します。

②タイトルを設定

まずは、アイテムのタイトルを設定しましょう。

③コンテンツのライティングを行う(※記事モデルの場合）

STUDIOのエディタは直感的で、マークダウン記法にも対応しています。ライブプレビューを使って、実際の表示を確認しながらライティングができます。

▼ 実際のエディタの画面

タグの設定が可能

見出しタグ（h1など）や本文用のpタグを使って、適切なタグを設定しましょう。これはSEO対策にも役立ちます。

記事で挿入できるもの一覧

以下の要素を記事内に挿入できます。目次(Table of contents)は、h1タグなどの見出しタグに沿って自動で目次を生成してくれます。

• 画像

• 表

• 引用

• 埋め込みコード

• 箇条書き・ナンバーリスト

• 区切り線

• 目次

太字や斜体・リンクなどの装飾も可能

太字、斜体、取り消し線、アンダーラインの設定が可能です。また、テキストにリンクを設定することもできます。

④各種プロパティーを設定

記事が完成したら、右側のプロパティ設定画面でタグ、スラッグ、カバー画像などを設定しましょう。

⑤公開日時の設定と公開(予約も可能！）

記事やプロパティの設定が終わったらワンクリックで公開ができます。日時指定で予約投稿や、過去の日時を手動で設定することも可能です。予約投稿のやり方はSTUDIO公式のこちらの記事をご覧ください。

CMSを使う際のSTUDIOの料金は？

STUDIOでCMSを運用する際に必要な料金体系については、下記の通りです。Starterプランでは、CMSを使うことができません。また、他のプランでもCMSで公開できるアイテム数に制限がありますので、必要に応じてアップグレードを検討しましょう。
参考記事：【2023年最新】STUDIOの料金プランまとめ-連携可能な外部サービスの料金まで

引用元：STUDIO公式HP

STUDIO CMSではできないこと

STUDIOのCMSは便利で使いやすいですが、WordPressなどと比較すると一部制限があります。

①人気記事の抽出やランキングの表示はできない

STUDIO CMSでは、人気記事やランキング表示機能を実装することはできません。これらの機能を利用したい場合は、コレクション機能を用いて特定のコンテンツを手動で表示・更新する必要があります。

②ページネーション機能を作れない

STUDIO CMSではページネーション機能を実装できませんが、「もっと見る」ボタンを設置して記事を追加表示することはできます。

③現在開いている記事を除いて表示できない

おすすめ記事など別の記事を表示させたい場合、現在読んでいる記事を除外して表示することはできません。そのため、読み終わったばかりの記事がおすすめ記事として表示されることがあります。

④複数のタグでの絞り込みができない

単一のタグでの絞り込み機能はありますが、複数のタグで同時に絞り込む機能は実装できません。

※ 参考記事：STUDIOでできること・できないことを徹底解説

STUDIO CMSの活用事例

実際にSTUDIO CMSで構築された制作事例をご紹介します。

NOROSHI Partners ブログ

今ご覧いただいている弊社のブログも、STUDIOのCMSで実装しています。カテゴリタグごとの分類機能やコレクション機能を用いたおすすめ記事の表示などを実装しています。

大谷石のkanehon　施工事例

弊社で制作させていただいた大谷石のkanehon様のサイトの施工事例もSTUDIOのCMSで実装しています。ブログやニュースだけではなく、実績や事例の紹介にもCMSを活用できます。

引用元：大谷石のKANEHON

YOUTRUST JOURNAL

STUDIOで制作されたオウンドメディアとして代表的なサイトです。カルーセル機能や、タグの分類機能などを用いた本格的なメディアサイトもSTUDIOのCMSで実装されています。

参考：STUDIO公式HP
引用元：YOU TRUST JOURNAL

STUDIOとWordPressの違い

ここでは、世界的に有名なCMSであるWordPressとSTUDIOの特徴の違いについて解説します。

(画像：Wordpress公式HP)

WordPressは、オープンソースのコンテンツ管理システム（CMS）であり、世界中のウェブサイトの約40%が利用している（2021年度時点）非常に人気のあるプラットフォームです。多くのテンプレートやプラグインが提供されており、これらを活用することで、コーディングの専門的な知識がなくても、Webサイトを制作できます。STUDIOとWordPressを様々な観点から比較し、表形式でまとめました。

各項目についてのより詳細な比較は、下記の参考記事をご覧ください。

※ 参考記事：STUDIOとWordPressの違いを徹底比較！どちらを選ぶべきかを解説

まとめ

WordPressなどのCMSを利用している方も多いと思いますが、こちらの記事で解説したように、STUDIO CMSは充分な機能を持ち、新機能も頻繁に追加されています。自由度の高いデザインや使いやすいCMSが求められる方は、ぜひSTUDIOでの制作を検討してみてください。