メールデザインのRow、Column、Hero、WrapperレイヤーにFigmaの画像塗りを設定すると、レイアウトに背景画像を追加することもできます。
パソコンの画像をColumnにドラッグ&ドロップする
Columnレイヤーにインラインのコンテンツ画像を追加するいちばん簡単な方法は、パソコンの画像ファイルをFigmaにドラッグ&ドロップし、その画像レイヤーをColumn内にドラッグする(必要に応じてサイズを変更する)ことです。
Figmaファイル内に、メールデザインのコンテンツ画像として使いたい画像がすでにある場合は、そのレイヤーをColumnレイヤーにドラッグ&ドロップすることもできます。
プラグインヘッダーのSettingsボタンから、画像に代替テキスト属性を設定したり、クリック可能なURLリンクを追加したりできます。
ほかの静的レイヤーを含む画像フレームをColumnに追加する
Columnレイヤーをクリックし、Quick Add要素メニューのドロップダウンでImageオプションを選択して、Add + ボタンをクリックすると、FigmaのColumnレイヤー内に新しい画像フレームを追加することもできます。
画像フレームを追加したら、Figmaで新しいレイヤーをクリックし、Figmaの右側の列にあるFillsパネルから画像塗りを追加します。
画像フレーム内にはほかのレイヤーも自由に追加できます。追加したレイヤーは、最終的なHTMLエクスポートで表示される1枚の静的な画像レイヤーに自動的に含まれます。
プラグインヘッダーのSettingsボタンから、画像に代替テキスト属性を設定したり、クリック可能なURLリンクを追加したりできます。