コンテンツ管理サービスのmicroCMS上のデータを、API連携・取得してSTUDIO上で扱うことができます。

この記事では、STUDIOでの microCMS API 連携手順と連携後の設定について解説します。

まずは、連携に必要なmicroCMSのcURLを取得します。

microCMSのコンテンツ一覧画面を開き、画面右上の 「API プレビュー」ボタンをクリックします。

右側からAPI情報が確認できる画面が表示されるので、cURLタブをクリックし表示された cURLをコピーします。

また、それぞれの画面上のコンテンツを、最低一つ以上「公開中」にしてください。

※現状、microCMSのコンテンツが非公開（下書き中または公開終了）だと、公開サイトはもちろん、エディター・ライブプレビューでもそのコンテンツは表示されません。

STUDIO デザインエディターを開き、左の追加パネルからAPIタブを開きます。

「＋新規追加」ボタンをクリックします。

表示された画面で、APIタイプ「 microCMS 」を選択します。

次に、microCMS でコピーした cURLを入力欄にペーストし、「次へ」をクリックします。

直後、API 確認が実施され、成功すると「API確認済み」となり連携完了です。
一旦、設定画面枠外をクリックしてエディターへ戻ります。

連携が完了すると、「追加パネル > APIタブ」に連携したAPI リクエストが表示されます。

使用したいAPI リクエストをクリックすると、「API リストパーツ」が表示されます。ドラッグ＆ドロップまたはクリックでページに配置します。

配置・追加したテキスト・画像ボックスなどの要素に、データパネルからAPIデータ（プロパティ）を紐付けてデザインしていきます。

プロパティの種類や紐付けの方法について詳しくは以下をご覧ください。

また、日付のフォーマットを変えたり、表示文字数を指定するなどテキストプロパティの表示を調整できます。

詳しくは、プロパティの文字列フィルタ l STUDIO U でご確認ください。