前回の前提条件のところで Wordpress に関する環境のチェックが終わっていれば、早速作業に入りましょう。今回は、CMS の環境となる Studio の作成と、コンテンツスキーマの準備になります。
Studio の準備とスキーマタイプ
2025-11-09
プロジェクトの作成
まず最初に Sanity のプロジェクトの作成を進めます。コマンドラインで以下のコマンドを実行してください。
sh
今回の環境はすでに Sanity のアカウントと紐づいているため、Organization に関する質問が表示されます。
しばらくすると新しい環境が作成されて、Sanity の管理画面からもアクセスできるようになります。
環境ファイルを追加する
作成されたプロジェクトには Sanity の Project ID などが埋め込まれている状態です。個人やチームで作業をする分には不要の手続きとなりますが、今回はサンプルのコードを公開する形にしたいため、以下のように変更をしていきます。
まず、以下のように .env ファイルを作成します。
text
続いて、上記の値を利用しているファイルを２つ変更します。
sanity.cli.ts
sanity.config.ts
これで環境変数として Project ID を管理することができるようになりました。
スキーマタイプの追加
Wordpress のコンテンツを保存するためのコンテンツスキーマの定義を追加していきます。今回は４つのスキーマタイプを追加します。
コンテンツのスキーマを追加
まずはページに関するコンテンツのスキーマを追加します。
./schemaTypes/pageType.ts
続いてブログの投稿のためのスキーマを追加します。
./schemaTypes/postType.ts
タグのスキーマを追加します。
./schemaTypes/tagType.ts
カテゴリのスキーマを追加します。
./schemaTypes/categoryType.ts
編集者のスキーマを追加します。
./schemaTypes/authorType.ts
これで Wordpress から取得するデータを格納するためのスキーマを一通り追加することができました。
スキーマのカスタマイズ
Wordpress で管理しているリッチテキストのコンテンツの部分を Sanity では Portable Text の形で管理をする形となります。扱うデータに関するカスタマイズを追加します。
./schemaTypes/portableTextType.ts
外部の画像に関する拡張を追加します。
./schemaTypes/externalImageType.ts
スキーマの拡張は今回はこの２点とします。
アイコンを追加する
公式のコンテンツでは、プロジェクトを作成してすぐにアイコンライブラリを追加しています。実はスキーマの定義で icon の項目があり、ここにさまざまなアイコンを指定することが可能となっています。今回は Sanity が提供するアイコンライブラリを採用して、管理画面での画像などの統一性は維持していきます。
アイコンライブラリの追加は以下の通りです。
sh
スキーマを反映する
作成をしたスキーマファイルを置いているだけでは反映されることがないため、./schemaTypes/index.ts のファイルを以下のように更新してください。
./schemaTypes/index.ts
追加したスキーマをこのファイルに反映させることで、変更が有効になります。
起動する
スキーマの拡張などの手続きが完了したところで、以下のコマンドを実行します。
sh
しばらくすると Sanity の管理画面が表示されます。
この環境に対して、Wordpress のコンテンツの移行を進めて行く形となります。
まとめ
今回は Wordpress から移行するのであればこのデータスキーマで、と言う形でサンプルのまま進めています。実際に移行が完了したあと、自分で作りたい環境にカスタマイズしていくことも可能です。
ここまでのコードは参考までに以下のリポジトリに公開をしています。
このページのステップは公式ページでは以下で公開されています。