グループコンテンツの転送/取り込み

CSV ファイルを使用してコレクション アイテムをインポートするか、CMS データベースを CSV ファイルにエクスポートします。

Webflow CMS でコレクションを生成する場合、コレクション コンポーネントを手動で追加したり、カンマ区切り値 (CSV) を含む CSV ファイルを使用して既存のグループに直接転送したりできます。これにより、数百または数千のコンポーネントを外部ソースから CMS に直接転送し、転送プロセス中に CSV コンテンツを参照フィールドに割り当てることができます。大量のデータの変更を容易にするために、CSV 転送を通じて既存のコレクション コンポーネントを選択的に修正することもできます。

また、任意の CMS グループのコンテンツを CSV ファイルとしてエクスポートするオプションもあります。これは、グループ コンポーネントのバックアップを保持したい場合に便利です。この CSV ファイルを使用して、グループ コンポーネントを他の Webflow サイトに転送したり、別のプラットフォームに移行したりできます。CMS データを別のサイトに移動するための情報を入手してください。

述べる: グループ コンポーネントを転送/インポートできるのは、デザイナー インターフェイスからのみです。

このチュートリアルでは、次の内容を取り上げます。 

  1. CSVファイルからグループコンポーネントを転送する方法
  2. グループコンポーネントをCSVファイルにエクスポートする方法

CSVファイルからグループコンポーネントを転送する方法

CSV ファイルからグループ コンポーネントを移行する際には、考慮すべき点がいくつかあります。以下について説明します。 

  1. CSVファイルのフォーマット方法
  2. Webflowに外部データをアップロードする方法
  3. フィールドの設定方法とコンポーネントのプレビュー方法
  4. 指定データをインポートする方法
  5. 画像転送に関する問題を解決する方法
述べる: CMS に転送できるグループ コンポーネントの数は、サイト プランの種類によって異なります。CSV ファイルの一番上の行は、グループ コンポーネントとしてカウントされず、この制限の対象にはなりません。 制限事項と価格の詳細については、価格ページをご覧ください。.

重要な: CSVファイルからグループコンポーネントを移行する際に、サイトのバックアップを生成するかどうかを選択するよう求められます。 はいインポート前のサイトのバックアップバージョンが作成され、後で復元することができます。 サイト設定 > バックアップ タブで問題が発生した場合は、バックアップを作成してください。ただし、多数のグループコンポーネントを含む大規模なサイトを管理する場合は、デザイナーでバックアップを作成することをお勧めします。 先立って CSV経由でグループコンポーネントのインポートを開始し、 いいえ インポート中にバックアップ手順をバイパスします。バックアップの保存と回復について詳しく調べてください。

述べる: CSV経由でグループコンポーネントをプライマリロケールビューにインポートすると、コンポーネントはすべてのセカンダリロケールに設定されます。特定のセカンダリロケールにコンポーネントをインポートする場合は、 ロケールビュー ドロップダウンから選択し、CSV ファイルのインポートを続行します。さらに、グループ コンポーネントのエクスポート中、エクスポートされた CSV ファイルには現在のロケール ビューのコンポーネントのみが含まれます。グループ コンテンツのローカライズの詳細については、こちらをご覧ください。

CSVファイルのフォーマット方法

通常、WordPress などの他のコンテンツ管理システムからエクスポートされた CSV は、すでに Webflow に準拠した形式でフォーマットされています。1 つの Webflow サイトから別の Webflow サイトにデータを転送する場合、エクスポートされた Webflow グループの CSV 構造を気にする必要はありません。

ただし、前述のソースからの既存の CSV を利用していない場合は、CSV を作成してそのデータをグループに転送することをお勧めします。Google Sheets、MS Excel、Airtable などのツールを使用して、グループ フィールドを表す列とグループ コンポーネントとその値を示す行を含むスプレッドシートを作成できます。スプレッドシートが準備できたら、CSV ファイルとして保存できます。

述べる: Excel で CSV ファイルを保存するときは、CSV タイプとして「カンマ区切り値」を選択してください。他の CSV 拡張子は、Webflow にアップロードすると正しく表示されない場合があります。1 列のデータのみを含む CSV がスムーズにインポートされるようにするには、ヘッダー列ラベル (例: Name,) の直後にカンマを挿入します。

サポートされているデータ分類

転送プロセス中にエラーが発生しないようにするには、CSV を Webflow と互換性のあるものにすることが不可欠です。画像、日付、数値、色などの特定のデータは、適切なフォーマットがないと認識されない場合があります。

データが正しくフォーマットされ、正しいグループ フィールド タイプに割り当てられるようにするには、データベース スプレッドシートをコンパイルするときに次のガイドラインに従ってください。 

グループフィールドタイプCSV行の内容
名前フィールド256文字未満の基本テキスト
スラッグフィールド256文字以下の基本テキスト
プレーンテキストフィールド基本的なテキスト
リッチテキストフィールドこのフィールドには任意の値をリンクできます。ただし、リッチ テキスト インポートの場合、このフィールドの値は HTML で作成する必要があります。
画像フィールド画像への直接 URL (画像ファイル拡張子で終わる URL)。サポートされている画像ファイル形式のみがグループに転送されます。
マルチ画像フィールドセミコロンで区切られた画像への直接 URL (例: https://images.unsplash.com/bird1.jpeg; https://images.unsplash.com/bird2.jpeg; https://images.unsplash.com/bird3.jpeg)
ビデオフィールド任意の YouTube または Vimeo の URL。他のビデオ URL をこのフィールドにリンクすることはできません。
リンクフィールド任意のURL
メールアドレス任意のメールアドレス
電話番号フィールド任意の電話番号形式
数値フィールド任意の数値。文字 (例: 100 USD)、記号 (例: $100)、またはカンマ (例: 10,000) を含む値は、このフィールドにリンクできません。
タイムスタンプフィールドどれでも サポートされている日付と時刻の形式
切り替えフィールド2 つの異なる値。たとえば、列に「True」と「False」の値のみが含まれている場合、これをトグル フィールド タイプとして指定し、マッピング ステージでどの値が「はい」を表すかを定義できます。
シェードフィールドWeb カラー形式の任意の値 (例: 色名、16 進コード、RGBA)。16 進コードの前にはポンド記号 (#) を付ける必要があります (例: #4353ff)。
選択フィールド任意の値。この列内のすべての一意の値が、このフィールドの選択肢として使用されます (最大 100 個のオプションに制限されます)。
ドキュメントフィールドdocument フィールドにリンクできるデータはありません。すべてのデータをインポートした後、ファイルを手動でアップロードできます。
メンションフィールドプレーンテキスト - 特別な書式設定は必要ありません(例:「チャールズ・ディケンズ」)
複数言及フィールドセミコロンで区切られたプレーンテキスト(例:“チャールズ・ディケンズ、ジェーン・オースティン、シャーロット・ブロンテ”)
注記: CSV 列がデフォルトの名前とスラッグ フィールドにリンクされていない場合は、CMS によって自動的に作成されます。

重要: インポート プロセス中に、リッチ テキスト フィールド内のすべてのコードは「クリーンアップ」され、Webflow と互換性のない要素、クラス、属性が削除されます。インポート後にリッチ テキスト コンテンツを確認することをお勧めします。

Webflowへの外部データの追加

Webflow コレクションに外部データを追加する方法を説明します。この操作では、次の手順について説明します。

  1. CSVファイルのアップロード
  2. ヘッダー行の指定
  3. インポートするアイテムの選択

CSVファイルのアップロード

Webflow の特定のコレクションに CSV ファイルを追加するには:

  1. アクセス CMSパネル
  2. コレクションアイテムをインポートするコレクションを選択します
  3. クリック 輸入
  4. CSVファイルをドラッグアンドドロップするか、コンピュータでファイルを参照します
注記: アップロード可能な CSV ファイルの最大サイズは 4MB です。

ヘッダー行の指定

CSV ファイルをアップロードすると、ヘッダー行を指定するように求められます。通常、CSV ファイルのヘッダー行には、各列のコンテンツの種類を定義する列のラベルが含まれます (たとえば、ヘッダー行には「名前」、「日付」などのラベルが含まれます)。

CSV ファイルをアップロードすると、ファイルのプレビューが表示され、最初の行がヘッダーとして機能するかどうかを確認するメッセージが表示されます。最初の行をヘッダーと見なしてインポートから除外する場合は、「はい、これはヘッダーです」または「わかりません」を選択します。行をインポートに含めるには、「いいえ、これはアイテムです」を選択します。ヘッダー行のラベルは、フィールド構成段階でコレクション アイテムのフィールド ラベルとして設定されます。

CSV を「CSV アップロード」モーダルにドラッグすると、CSV のヘッダー行を決定するように求められます。

この段階での選択に関係なく、最初のコレクション項目に進み、後続の手順で「ヘッダー行」ボックスをマークするかマーク解除するかを決定できます。

インポートするアイテムの選択

ヘッダー行を定義すると、CSV ファイルの処理が完了したことを示す確認メッセージが表示されます。この確認メッセージには、新しくアップロードされた CSV アイテムがコレクション内の既存のアイテムと一致するかどうかも示されます。

注記: ヘッダー行を指定していない場合、または最初の行がヘッダーであるかどうか不明な場合は、既存の一致する項目を更新するオプションなしで、フィールド構成に直接移動します。基本的に、Webflow は、指定されたヘッダー行なしでコレクション項目 ID 列またはコレクション フィールド列にマップすることは不可能であるため、デフォルトで新しいコレクション項目を作成します。

一致するアイテムの場合(既存のコレクション アイテムと CSV データが同じ ID を共有している場合)、次のいずれかを選択できます。

  • 一致するアイテムを更新コレクション内の既存のアイテムをCSVアップロード内のアイテムと揃えて更新します
  • すべてのアイテムを新しいエントリとしてインポートする一致するアイテムをCSVからコレクションの新しいエントリとしてインポートします。

「一致するアイテムを更新する」を選択すると、コレクション内の既存のアイテムをすばやく変更するのに効果的です。たとえば、CSVファイルで特定のアイテムのデータを更新した場合、 のみ 更新されたアイテムを使用すると、コレクション アイテム内の古いコンテンツを新しいデータにすぐに置き換えることができます。

注記: 通常の CMS アイテムは、コレクションからの CSV エクスポートにある「アイテム ID」フィールドに基づいて照合されます。また、バックアップからサイトを復元すると、すべての CMS コレクションとアイテム ID が更新されることに留意してください。バックアップの保存と復元の詳細については、こちらをご覧ください。

一致するアイテムを更新するか、すべてのアイテムを新しいエントリとしてインポートするかを選択したら、CSV データを設定してコレクション フィールドにマッピングすることができます。一致するアイテムがない場合も、このフェーズに進みます。

注記: CSV インポートによるアイテムの更新は、e コマース アイテムには適用されません。e コマース製品とバリエーションのインポートの詳細については、こちらをご覧ください。

フィールド設定とアイテムのプレビュー

フィールド構成

CSV ファイルをアップロードすると、インポートされたアイテムのフィールド構成セクション内で、列が構成用のフィールドとしてアクセスできるようになります。指定すると、列ヘッダーがコレクション フィールドのラベルとして表示されます。

注記: CSV ヘッダー名が既存のコレクション フィールド名と一致する場合、それらは自動的に揃えられるため、構成手順が省略されます。

入力フィールドの値は選択した行から取得されます。各行は1つのコレクションアイテムに対応しています。 アイテムのプレビュー 右側のパネル。

このフェーズでは、どのCSV列をマッピングし、どの列を除外するかを選択してコレクションフィールドを設定します。

各列とフィールドの選択肢: 

  • 省略
  • 新たなフィールドを確立
  • 既存のフィールドとの相関
省略

CSVにCMSフィールドと関連付けたくない列がある場合は、 省略 ドロップダウンから選択します。 

新鮮なフィールドを確立する

既存のコレクション フィールドが利用できない場合は、新しいコレクション フィールドを作成して列に関連付けることができます。 

  1. 選択する 新たなフィールドを確立 ドロップダウンから
  2. ドロップダウンからフィールドタイプを選択します。列の内容と一致しないフィールドタイプはアクセスできず、フェードアウトします。
  3. 新しいフィールドラベルを挿入します 新しいフィールドラベル セクション、または提案されたラベルを保持する
  4. (オプション)補足 ヘルプテキスト ラベルの下に表示する 

選択したフィールドタイプに応じて追加の設定が利用できる場合があります。追加の オプション フィールドには、その列のすべての一意の値が入力されます(これらの値は大文字と小文字が区別されることに注意してください)。新しい スイッチ フィールドでは、「いいえ」に対応する値を定義できます。 

既存のフィールドとの相関

各列をコレクション内の既存のフィールドにリンクできます。 

  1. 選ぶ 既存のフィールドとの相関 ドロップダウンから
  2. ドロップダウンからこの列をリンクするフィールドを選択します。列の内容をサポートしていないフィールドにはアクセスできず、フェードアウトして表示されます。
リマインダー: 列ラベルの横にある緑色の「ドット」アイコンは、列が接続されていることを示します。

新しいスイッチフィールドでは、「いいえ」に対応する値を定義したり、 スワップ 値を「はい」にリンクします。

知っておくと役に立つ情報: すでに非アクティブに使用されている既存のフィールドと列をペアにすることはできません。列タイプを組み合わせる必要がある場合は、新しいフィールドを作成できます。

アイテムをプレビュー

インポートする各項目のフィールドと値は、 アイテムのプレビュー 右側のペイン。 

左と右の「矢印コレクションアイテム間を移動するには、プレビューパネルの上部にある「」ボタンをタップします。 アイテムオプションを表示 インポートするすべてのアイテムのリストを表示するには、上部のバーにあるボタンをクリックします。 アイテムオプションを表示 表示されているアイテムの名前をタップするとプレビューにジャンプします。また、テキストを入力することもできます。 検索バー 特定のアイテムを検索します。

左側のパネルで接続されたフィールドまたは元のフィールドにマウスを移動すると、アイテムのプレビューで対応するフィールドが強調表示されます。プレビュー アイテムは、フィールドを設定するとリアルタイムで更新されます。

特定の項目のフィールド値を変更する必要がある場合は、フィールドを設定する前に変更するか、 輸入しない ドロップダウンから選択します。

特定のアイテムをコレクションにインポートしないという選択肢もあります。 

  1. プレビュー ペインでインポートしたくないアイテムを見つけます (矢印、ドロップダウン メニュー、または検索バーを使用してアイテムに移動します) 
  2. スイッチをつける インポートをスキップ 

スキップされた項目は、 アイテムのプレビュー ペインと アイテムオプションを表示 「インポートをスキップ」のシンボルが表示されます。

要件/チェックのあるフィールド

CSV列の1つに必須参照フィールドにリンクされているセルがあるが、そのセルが空であるか、参照先のコレクションに値がない場合、アイテムが存在しないという通知が表示されます。必須フィールドであるため、その行のアイテムは 下書き参照フィールドは空白のままになります。 

リンクされた参照フィールドが必須ではなく、その列のセルが空であるか、参照されたコレクションの値がない場合は、その行のコレクション項目は次のように指定されます。 公開に向けて準備完了 インポート後、参照フィールドは空のままになります。

リンクされたデータをインポートする方法

コレクションフィールドとCSVデータを設定したら、タップします 輸入 データをコレクションに統合します。 

重要: CSVファイルからコレクションアイテムを取り込む場合、サイトのバックアップを作成するように求められます。 はいインポート前のサイトのバックアップコピーが生成され、後で復元することができます。 サイト設定 > バックアップ タブで問題が発生した場合に備えて、バックアップを作成してください。ただし、サイトが大規模で、既存のコレクションアイテムが多数ある場合は、デザイナーでバックアップを作成することをお勧めします。 先立って CSVインポートプロセスを開始し、 いいえ インポート中にバックアップ フェーズをスキップします。バックアップの保存と復元の詳細については、こちらをご覧ください。

すべてのアイテムがインポートされるまで、デザイナーに留まるようにしてください。コレクションからアイテムの一部またはすべてが除外された場合、スキップされたアイテムのリスト、インポートが失敗した理由、詳細なエラー レポートの概要をダウンロードするためのリンクが表示されます。

画像のインポートに関する問題を解決する方法

CSVファイル内の壊れた画像リンクは、コレクション内の画像フィールドにリンクできません。次のような大量のURLチェッカーを活用できます。 HTTP ステータス コード チェッカー 壊れたリンクを特定して修正します。 

CSV ファイル内の壊れたリンクを検査して修正するには: 

  1. CSVファイルを開く 
  2. 「URL」列をコピーします
  3. 「URL」列のデータを 大量 URL チェッカー
  4. ステータスコードを評価して壊れたURLを特定します。ステータスコード200はエラーのないURLを意味します。
  5. エラーステータスコードのあるURLを特定し、CSVファイル内のリンクを置き換えるか除外します。 
  6. CSVファイルを保存し、コレクションへのインポートを再試行してください

コレクションアイテムをCSVファイルにエクスポートするためのガイドライン

コレクション アイテムを CSV ファイルにエクスポートするには、次の 2 つの方法があります。 

  1. コレクション全体をエクスポートする(アーカイブされたアイテムを含む) 
  2. コレクションアイテムを個別に選択してエクスポートする

コレクション アイテムを CSV ファイルにエクスポートする場合は、コレクション フィールドがどのようにエクスポートされるかを理解していることを確認してください。 

リマインダー: コレクション アイテムをエクスポートする場合、エクスポートされた CSV ファイルには現在のロケール ビューのアイテムのみが含まれます。コレクション コンテンツのローカライズの詳細については、こちらをご覧ください。 

コレクション全体をエクスポートする 

コレクション全体のコンテンツ(アーカイブされたアイテムを含む)を CSV ファイルにエクスポートするには: 

  1. に向かう CMSパネル 
  2. エクスポートしたいコレクションの名前をタップします
  3. タップ 輸出

コレクション フィールドがエクスポートされる方法を確認します。

コレクションアイテムを個別にエクスポートする

個々のコレクション項目を CSV ファイルに選択的にエクスポートするには: 

  1. (オプション)コレクションアイテムを検索、フィルタリング、または並べ替える
  2. タップ 選択する エクスポートしたいアイテムを一括選択または個別に選択する 
  3. タップ 輸出 CSVファイルを生成してダウンロードする 
プロのヒント: 個々のコレクション アイテムを CSV ファイルにエクスポートし、CSV ファイルでそれらのアイテムを変更し、更新されたコレクション アイテムのみをコレクションに再インポートして、古いコンテンツを新しい変更内容に置き換えることができます。CSV インポートを使用して一致するコレクション アイテムを更新する方法の詳細をご覧ください。 ‍

コレクション フィールドがエクスポートされる方法を確認します。

コレクションフィールドのフォーマットをエクスポートする

参照を含むほとんどのコレクション フィールド コンテンツは、プレーン テキスト文字列または URL としてエクスポートされます。複数参照フィールドは、カンマで区切られたテキストのリストとしてエクスポートされます。リッチ テキスト フィールドは HTML としてエクスポートされます。画像とファイルは、Webflow でホストされる URL としてエクスポートされます。 

重要: 画像フィールドとファイル フィールドの URL は、コレクションをエクスポートしたサイトに関連付けられています。つまり、元のサイトを削除すると、それらのアセットも削除され、CSV ファイルのリンクが壊れることになります。リッチ テキスト フィールドの画像にも同じことが当てはまります。コレクションを新しい Webflow サイトに移行するのでない限り、元のサイトをバックアップとして保持するか、各画像とファイルを手動でダウンロードしてください。 

リマインダー: エクスポートされたコレクションを別の Webflow サイトにインポートすると、画像フィールドにリンクされた画像が新しいサイトに新しい画像としてインポートされます。現在、ファイル フィールド データは新しいサイトにインポートできないため、手動でアップロードする必要があります。 
ユアン・マック