動画チュートリアル:FigmaでスプレッドシートをHTMLメール用のテーブルにインポートする
この動画では、Emailifyプラグインを使って、XLSX・CSVやGoogle SheetsからFigmaでHTMLメール用のテーブルを自動生成する方法を解説します。
🧾 Spreadsheetオプションを使うと、CSV・XLSXのスプレッドシートからデータをインポートし、その内容を複数の行と列を持つHTMLテーブルに自動で変換できます。行や列を増やしたい場合は、最初に作成されたテーブル行やテーブルのデータセルのFigmaレイヤーをコピー&ペーストします。
なお、🧾 Spreadsheetはデスクトップとモバイルで同じように表示されます。テーブルに列を3つ以上追加する場合は、テーブルの幅に注意してください。
「Quick Add」機能で新しいEmailifyレイヤーを追加する
Emailifyでは、Figmaのデザインにレイヤーとして追加される専用のレイアウトブロックとコンテンツ要素を使ってデザインを組み立て、プラグインからHTMLにエクスポートできます。
これらのレイアウトブロックやコンテンツ要素を追加するには、Emailifyフレームを1つ以上作成しておき、そのフレームをクリックします。プラグイン下部にQuick Add Elementコンテキストメニューが自動で表示されるので、追加したい要素をクリックし、Add + ボタンをクリックすると、選択したレイヤーに追加されます。
コンテキストメニューに表示されるオプションは、現在選択しているFigmaのレイヤーに応じて変わります。