ファイルフィールドは、PDF、CSV、ZIP、Excelなど、画像以外の様々な形式のファイルを管理・紐付けるためのフィールドです。
ホワイトペーパーの配布や製品仕様書の共有などのユースケースに適しています。

データの入稿方法

1. ファイルフィールドをクリックすると「メディア管理」のモーダルが表示されます。
2. すでにアップロードされているファイルを選択するか、[+ アップロード]ボタンから新しいファイルをアップロードします。
3. 使用したいファイルをクリックし、[このファイルを使用する]ボタンを押すと選択が確定します。

補足

• 入稿後に表示される [×] ボタンをクリックすると、選択が解除されます。

API、CSVを利用した入稿については以下のドキュメントをご参照ください。

制限事項／注意事項

• ファイルフィールドはHobbyプランではご利用いただけません。
• 入稿できるのはmicroCMSの同じサービスにアップロードされたファイルのみです。

詳細設定

GET APIのレスポンス形式

詳細は以下のドキュメントをご参照ください。

フロントエンドでの利用方法

ファイルフィールドはオブジェクト形式で返却されるため、urlプロパティを参照してリンクを作成します。
以下はNext.jsで、PDF資料へのリンクを表示する実装例です。

export default async function Page({ params }) {
  const { slug } = await params;

  // microCMS JavaScript SDK（https://github.com/microcmsio/microcms-js-sdk）を使用してデータを取得
  const data = await client.getListDetail({
    endpoint: "blog",
    contentId: slug,
  });

  return (
    <main>
      {/* file はフィールドIDです。実際のフィールドIDに置き換えてください */}
      <a href={data.file.url} target="_blank" rel="noopener noreferrer">
        資料をダウンロードする
      </a>
    </main>
  );
}