コレクション

コレクションは、ブログ記事、製品情報、著者など、同じ種類のコンテンツをひとまとめに管理するための単位です。

基本構造

{
  "collections": [
    {
      "name": "posts",
      "label": "ブログ記事",
      "description": "ブログの投稿を管理します",
      "path": "content/posts",
      "extension": "md",
      "fields": [...],
      "layout": [...],
      "pico": {...}
    }
  ]
}

プロパティ

プロパティ必須デフォルト説明
namestringYes-コレクションの識別子(英数字)
labelstringNo-CMS上での表示名
descriptionstringNo-コレクションの説明
pathstringYes-コンテンツファイルを格納するディレクトリパス
extensionstringYes-ファイル拡張子("md"または"json"
singletonbooleanNofalseシングルトン(単一コンテンツ)かどうか
fieldsField[]Yes-フィールド定義の配列
layoutstring[][]No-フィールドの配置を定義する2次元配列
picoPicoSettingsNo-CMSで使う値の設定

name

コレクションの識別子です。英数字のみ使用できます。

{
	"name": "posts"
}
  • 他のコレクションと重複しない一意の値を指定
  • relationフィールドで参照する際に使用

label

CMS上で表示される名前です。省略した場合はnameが表示されます。

{
	"name": "posts",
	"label": "ブログ記事"
}

日本語を含む分かりやすい名前を指定できます。


description

コレクションの説明文です。編集者がコレクションの用途を理解するのに役立ちます。

{
	"name": "posts",
	"label": "ブログ記事",
	"description": "技術ブログの記事を管理します"
}

path

コンテンツファイルを格納するディレクトリのパスです。リポジトリルートからの相対パスで指定します。

{
	"name": "posts",
	"path": "content/posts"
}

例:

  • "content/posts" → リポジトリルート/content/posts/
  • "src/content/blog" → リポジトリルート/src/content/blog/
  • "docs" → リポジトリルート/docs/

extension

コンテンツファイルの形式を指定します。

形式用途
"md"マークダウンブログ記事など、本文があるコンテンツ
"json"JSON設定、製品情報など、構造化データ

マークダウン形式("md")

{
	"extension": "md"
}

ファイルはYAMLフロントマッター + 本文の構造になります。

---
title: '記事タイトル'
category: 'tech'
publishedAt: '2024-01-15'
---

本文がここに入ります。

見出しやリストも使えます。
  • pico.bodyで指定したフィールドは本文部分に格納
  • その他のフィールドはYAMLフロントマッターに格納

JSON形式("json")

{
	"extension": "json"
}

すべてのフィールドがJSONオブジェクトとして格納されます。

{
	"name": "商品A",
	"price": 1000,
	"description": "<p>商品の説明文</p>"
}
  • pico.bodyは無視される
  • richtextフィールドはHTML文字列として保存

singleton

trueを指定すると、コレクションは単一のコンテンツとして扱われます。サイト設定やAboutページなど、1つだけ存在すれば良いコンテンツに適しています。

{
	"name": "settings",
	"label": "サイト設定",
	"path": "content/settings",
	"extension": "json",
	"singleton": true,
	"fields": [
		{ "name": "siteName", "type": "string", "label": "サイト名" },
		{ "name": "tagline", "type": "string", "label": "キャッチコピー" },
		{ "name": "logo", "type": "image", "label": "ロゴ" }
	]
}

シングルトンの特徴

通常のコレクションシングルトン
複数のコンテンツを作成可能1つのコンテンツのみ
一覧画面が表示される直接編集画面が表示される
新規作成・削除が可能新規作成・削除は不可

fields

コンテンツが持つフィールドを定義します。詳細はフィールドを参照してください。

{
	"fields": [
		{ "name": "title", "type": "string", "label": "タイトル", "required": true },
		{ "name": "slug", "type": "string", "label": "スラッグ", "required": true },
		{ "name": "content", "type": "richtext", "label": "本文" },
		{ "name": "publishedAt", "type": "date", "label": "公開日", "includeTime": true }
	]
}

layout

フィールドをUI上でどのように配置するかを定義します。詳細はlayoutを参照してください。

{
	"layout": [["title"], ["slug", "category"], ["content"]]
}

pico

CMS UIで使う特別なフィールドを指定します。詳細はpicoを参照してください。

{
	"pico": {
		"title": "title",
		"body": "content",
		"createdAt": "publishedAt",
		"draft": "isDraft"
	}
}

設定例

ブログ記事

{
	"name": "posts",
	"label": "ブログ記事",
	"path": "content/posts",
	"extension": "md",
	"fields": [
		{ "name": "title", "type": "string", "label": "タイトル", "required": true },
		{
			"name": "slug",
			"type": "string",
			"label": "スラッグ",
			"required": true,
			"pattern": "^[a-z0-9-]+$"
		},
		{ "name": "content", "type": "richtext", "label": "本文", "required": true },
		{ "name": "thumbnail", "type": "image", "label": "サムネイル" },
		{
			"name": "category",
			"type": "select",
			"label": "カテゴリ",
			"options": [
				{ "value": "tech", "label": "テクノロジー" },
				{ "value": "life", "label": "ライフスタイル" }
			]
		},
		{
			"name": "tags",
			"type": "checkbox",
			"label": "タグ",
			"options": [{ "value": "javascript" }, { "value": "typescript" }, { "value": "svelte" }]
		},
		{ "name": "author", "type": "relation", "label": "著者", "collection": "authors" },
		{ "name": "publishedAt", "type": "date", "label": "公開日時", "includeTime": true },
		{ "name": "isDraft", "type": "boolean", "label": "下書き", "default": true }
	],
	"layout": [["title"], ["slug", "category"], ["tags"], ["thumbnail"], ["author"], ["content"]],
	"pico": {
		"title": "title",
		"body": "content",
		"createdAt": "publishedAt",
		"draft": "isDraft",
		"sort": "publishedAt",
		"sortOrder": "desc"
	}
}

著者

{
	"name": "authors",
	"label": "著者",
	"path": "content/authors",
	"extension": "json",
	"fields": [
		{ "name": "name", "type": "string", "label": "名前", "required": true },
		{ "name": "bio", "type": "text", "label": "自己紹介" },
		{ "name": "avatar", "type": "image", "label": "アバター" },
		{ "name": "twitter", "type": "string", "label": "Twitter" }
	],
	"pico": {
		"title": "name"
	}
}

製品情報

{
	"name": "products",
	"label": "製品",
	"path": "content/products",
	"extension": "json",
	"fields": [
		{ "name": "name", "type": "string", "label": "製品名", "required": true },
		{ "name": "price", "type": "number", "label": "価格", "min": 0 },
		{ "name": "description", "type": "richtext", "label": "説明" },
		{ "name": "images", "type": "image", "label": "画像" },
		{ "name": "category", "type": "relation", "label": "カテゴリ", "collection": "categories" },
		{ "name": "inStock", "type": "boolean", "label": "在庫あり", "default": true }
	],
	"layout": [["name", "price"], ["category", "inStock"], ["images"], ["description"]],
	"pico": {
		"title": "name"
	}
}