モバイルやデスクトップでレイヤーを非表示にする

何らかの理由でモバイルやデスクトップで特定の要素を非表示にしたい場合は、プラグインのヘッダーにあるSettingsボタンをクリックし、Emailifyのコンテナフレーム内の任意のレイヤーをクリックします。モバイルで非表示にするにはHide On Mobileトグルを、デスクトップで非表示にするにはHide On Desktopトグルを有効にします。

プラグインのHTMLプレビュー機能を使えば、表示・非表示の上書き設定を視覚的に確認できます。

モバイルとデスクトップで別々の画像レイヤーを使う

モバイルとデスクトップでコンテンツ要素の異なるバリエーションを表示するには、Figmaのレイヤーを複製し、どちらかの画像を選択した状態でSettingsパネルを開いて、一方をHide on Mobile、もう一方をHide on Desktopに設定します。これで、それぞれがデスクトップかモバイルのどちらか一方にだけ表示されます。

なお、この方法は控えめに使ってください。両方の画像レイヤーがそれぞれ独自の表示設定を持つ通常の画像要素としてエクスポートされるため、使うたびにHTMLエクスポートのコードが増えます。

Settingsを開いてから、Figmaで同じ種類のEmailifyレイヤーを複数選択すると、設定を一括で適用できます。変更した設定は、選択したすべてのレイヤーに適用されます。