STUDIOのCMSデータをブログのようにカテゴリ分けする方法

当ページのリンクには広告が含まれています。
  • URLをコピーしました!
生徒

STUDIOのCMSでもブログのようにカテゴリに分けることはできますか?

先生

STUDIOのCMSでカテゴリに分ける方法を説明します

この記事でわかること
  • STUDIOのCMSデータをカテゴリ分けして表示する方法
目次

CMSのデータをカテゴリに分ける

STUDIOのCMSデータをカテゴリ分けするには、ブログ記事を記事型のデータとして作成するのと同じように、記事のカテゴリをカテゴリ型のデータとして作成します。

その上で記事型のデータの中にカテゴリ型の項目を追加して各記事をカテゴリに紐づけます。

記事データを作成する

STUDIOのCMSで記事タイプのデータを作成します。

記事データを作成する詳しい手順は以下の記事で説明しています。

以下は上記の記事の手順で記事データを作成後のCMSの画面です。
この記事では、この状態からカテゴリを追加していきます。

記事型のモデルだけ作成して、記事データは後で作成するのでも構いません。

カテゴリモデルを作成

CMSの画面でモデルのボタンをクリックします。

新規モデルの作成画面でモデル名を入力してモデルタイプカテゴリータイプを選択して 作成するボタンをクリックします。

作成したモデルのデータを作成します。

+ 作成するボタンをクリックします。

カテゴリ型のデータの作成画面で、タイトルSlug(スラッグ)を入力します。

カテゴリに題名以外の情報を追加したい場合

以下はカテゴリの各データに画像項目を持たせる場合の手順になります。

カテゴリデータの編集画面でプロパティを追加をクリックします。

一番上の入力欄にプロパティ名を入力してプロパティタイプは画像を選んで 追加ボタンをクリックします。

これでカテゴリモデルのデータに画像項目が追加されます。

作成したカテゴリ型のデータを公開するために公開するをクリックします。

公開していないカテゴリも使用できますが、公開サイトではカテゴリのTitleなどが表示されず空白になります。(ライブプレビューでは表示されます。)

続けて別のカテゴリを作成するために複製をクリックします。

複製された別のカテゴリの入力画面になります。

複製したカテゴリにも値を入力して同じように公開するをクリックします。

同じようにして、カテゴリのデータを必要なだけ作成します。

記事にカテゴリを追加する

今度は、投稿モデルのデータにカテゴリの入力欄を追加します。

投稿データの一覧画面でリスト上部にあるをクリックしてプロパティを追加を選択します。

プロパティ名にカテゴリと入力してモデルを参照カテゴリを選択します。

設定シングルセレクトを選択します。

一つの記事に2つ以上のカテゴリを設定したい場合はマルチセレクトを選択します。

投稿データのリストに、カテゴリ列が追加されます。

CMSの投稿データのリストのカテゴリ列をクリックして選択できるアイテムでカテゴリを選択します。

選択したカテゴリが、投稿データにセットされます。

公開後にデータに行った編集は、そのままでは公開しているデータには反映されません。

編集したデータの先頭列のをクリックして更新するを選択することで、編集内容が公開データに反映されます。

は公開されていない編集データがある状態を表します。

最新の内容が公開された状態になり、先頭列がに変わります。

入力したカテゴリを削除したいとき

入力したカテゴリを削除したい場合、カテゴリ列を彩度クリックして選択中のカテゴリの右の×ボタンをクリックします。

カテゴリを各データの編集画面で入力する場合は、先頭列を選択してをクリックします。

カテゴリデータ編集画面でカテゴリ欄を入力します。

すべての投稿データにカテゴリをセットします。

カテゴリの使い方

カテゴリの表示

カテゴリも他のCMSの項目と同様に表示することができます。

デザインエディタに移動します。

画面左側の一番下のアイコンをクリックします。

追加タブを開いてCMSを選択して一番上のリストをクリックして配置します。

一番下のテキスト欄を選択して右上のアイコンをクリックします。

テキスト欄は下のレイヤーにあるため、数回クリックを繰り返すことで選択します。

ボックスの情報が表示されるのでテキストをクリックしてDeleteキーで空欄にします。

CMSプロパティから選択カテゴリ Titleを選択します。

CMSリストの各記事にカテゴリが表示されます。

指定したカテゴリのみ表示

CMSデータのリストを選択して画面右側のアイコンをクリックします。

リストのフィルターカテゴリを選択します。

フィルター条件でカテゴリのいずれかを選択します。

リストに選択したカテゴリのデータのみが表示されます。

よかったらシェアしてね!
  • URLをコピーしました!
目次