---
url: "/ja/copydoc/sync/airtable.md"
description: "スプレッドシートをAirtableで作成している場合は、Figmaのデザインと同期できます。"
---

# AirtableからFigmaにコンテンツを同期する

> スプレッドシートをAirtableで作成している場合は、Figmaのデザインと同期できます。

### 動画チュートリアル：AirtableのスプレッドシートのコンテンツをFigmaに同期する

この動画では、CopyDocプラグインを使って、AirtableのスプレッドシートのコンテンツをFigmaに同期する方法を解説しています。
[Embedded media](https://www.youtube-nocookie.com/embed/SFAjIzF6P9o)

### 動画チュートリアル：スプレッドシートからFigmaレイヤーを自動で繰り返して同期する

この動画では、CopyDocプラグインを使って、スプレッドシートからFigmaレイヤーを自動で繰り返して同期する方法を解説しています。
[Embedded media](https://www.youtube-nocookie.com/embed/_1MHyfYNHFQ)

## AirtableのコンテンツをFigmaレイヤーに同期する {#syncing-your-airtable-content-to-figma-layers}

[Video](/assets/videos/copydoc/sync/airtable-sync.mp4)

CopyDocの**Sync Content**機能でAirtableのコンテンツを追加するには、プラットフォームのドロップダウンから**Sync from Airtable URL**を選びます。次に、3つの項目を入力します。

### AirtableシートのURL {#your-airtable-sheet-url}

シートを作成するには、[Airtable](https://airtable.com/)にログインして**Create a base**をクリックし、追加先の**Workspace**を選んでから、**Create**をクリックします。

AirtableシートのURLは次のような形式です：`https://airtable.com/appzkSCDvQhxjfrl3/tbl9Ug0eTNoZFX5ne/viwULclwtTCrQq4dR?blocks=hide`

### Airtableの個人アクセストークン {#your-airtable-personal-access-token}

Airtableの[Personal Access Token](https://airtable.com/developers/web/guides/personal-access-tokens)ページから[トークンを作成](https://airtable.com/create/tokens)できます。

Airtableの個人アクセストークンは次のような形式です：`patCDDXkwmgP4CyJK.19aa66430076753f90aaf1b27ae0a4ddf14f445dce8add9bd539bcbefcbe35df`

トークンの**Scopes**を`data.records:read`と`schema.bases:read`に設定し、同期したいベースへのアクセス権を付与します。スキーマのスコープがあると、CopyDocはすべてのレコードで空欄になっている列も認識できるため、対応するテキストレイヤーを空にできます。`data.records:read`だけのトークンでも、返された列は同期できますが、列全体が空欄の場合は、テンプレートのテキストがそのまま残ることがあります。

### Airtableのカスタムラベル {#custom-airtable-label}

AirtableのURLを使うときに見分けやすいように、カスタムラベル（例：`My Airtable Snippets`）を設定する必要があります。

これらの項目を入力したら、**Save New Airtable +** をクリックすると、コンテンツのプレビューが読み込まれ、ビューがFigmaファイルに保存されます。同じテーブルの複数のビューを、別々のラベルで保存できます。同じビューをもう一度追加すると、保存済みの既存の項目が選択されます。

### 空欄の項目 {#blank-fields}

`schema.bases:read`を有効にしていると、選択したビューで列全体が空欄の場合でも、空のセルに対応するテキストレイヤーが空になります。テーブルの列に一致しないレイヤーは、既存の内容のまま変わりません。CopyDocは、選択したビューのすべてのレコードページを読み込みます。

CopyDocがフィールドの一覧を読み取れない場合は、メッセージが表示され、レコードと一緒に返されたフィールドを使って処理を続けます。求められた場合はトークンにスキーマのスコープを追加してから、コンテンツのプレビューを再読み込みしてください。フィールドの一覧が一時的に利用できない場合は、再読み込みして再試行してください。

`MODERATED BY`のようなラベルは、Airtableのセルにそのテキストが入っている限り表示されたままです。ラベルを消したい場合は、そのセルも空にしてください。

> **Warning:** **フォントが見つからないFigmaのテキストレイヤーは更新できません。** Figmaのテキストレイヤーに[見つからないフォント](https://help.figma.com/hc/en-us/articles/360039956994-Manage-missing-fonts)が含まれている場合、プラグインはそのレイヤーを更新できません。CopyDocプラグインで何らかの更新を行いたいテキストレイヤーは、見つからないフォントの問題を解決しておいてください。

## スプレッドシートの行に合わせて1つのFigmaレイヤーを自動で繰り返す {#auto-repeat-a-single-figma-layer-with-your-spreadsheet-rows}

[Video](/assets/videos/copydoc/sync/auto-repeat-sync.mp4)

**Content**または**Styles**の同期タブを使うときは、**Auto Repeat**のトグルをオンにすると、1つのFigmaレイヤーを自動で繰り返せます。選択した元のFigmaレイヤーが自動的にコピーされ、スプレッドシートのデータの行数と同じ数だけ複製されます。

これを使うと、1つのカード、カタログアイテム、キャンペーンのレイアウトから、スプレッドシートの行ごとにコンテンツを流し込んだデザインを作れます。デザイン内のテキストレイヤーと画像レイヤーには、対応するスプレッドシートの列が使われます。

メインコンポーネントを選択した場合、CopyDocは行ごとにインスタンスを作成します。既存のインスタンスを選択した場合はそのインスタンスが、フレームを選択した場合はそのフレームが複製されます。

選択したFigmaレイヤーが、Auto Layoutが有効な別のFigmaレイヤーの直下にすでにある場合は、選択したレイヤーがその親レイヤーの中に自動的に複製されます。そうでない場合は、CopyDocが新しいAuto Layoutフレームを作成し、その中に新しいFigmaレイヤーを複製します。

### 自動で繰り返す親レイヤーの動的な名前 {#dynamic-auto-repeating-parent-layer-names}

[Video](/assets/videos/copydoc/sync/auto-renaming-frames.mp4)

複製した各Figmaレイヤーにスプレッドシートから名前を付けるには、選択したテンプレートレイヤーの名前を列見出しと一致させます。CopyDocは、各行のその列の値を新しいレイヤー名として使います。

先頭の`#`は1つまでなら省略できます。`#Title`という名前のレイヤーは`Title`列に、`Title`という名前のレイヤーは`#Title`列に一致させられます。両方の見出しがある場合は、値が空欄でも完全に一致するほうが優先されます。大文字・小文字とスペースは一致している必要があります。

スプレッドシートに一致するレイヤー名がない場合、CopyDocプラグインは元のFigmaレイヤー名に行番号を付けた名前（例：`My Frame Layer (Row 3)`）を使います。