Show Menu
トピック×

新規での電子メールのデザイン

電子メールコンテンツの編集をマスターする方法について説明します。 電子メールデザイナーを使用すると、独自の定義済みコンテンツで始まる電子メールやテンプレートを作成できます。

電子メールを作成するための主要な手順

電子メールデザイナーを使用して電子メールコンテンツを最初から作成し、デザインする主な手順は次のとおりです。
  1. 電子メールを作成し、その内容を開きます。
  2. 電子メールの形状を決める構造コンポーネントを追加します。 「電子メ ール構造の編集」を参照してください
  3. 構造コンポーネントにコンテンツコンポーネントとフラグメントを挿入します。 詳しくは、フラ グメントとコンテンツコンポーネントの追加を参照してくださ い。
  4. 画像を追加し、電子メールのテキストを編集します。 詳しくは、イ メージの挿入を参照してくださ い。
  5. パーソナライゼーションフィールドやリンクなどを追加して、電子メールをパーソナライズします。 詳しくは、 パーソナライゼーション フィールドの挿入 、リンクの挿入 、電子 メールでの動的コンテンツの定義を参照してください
  6. 電子メールの件名行を定義します。 See Personalizing the subject line of an email .
  7. 電子メールをプレビューします。
  8. コンテンツを保存し、オーディエンスが定義され、送信が正しくスケジュールされていることを確認した後、メッセージを進めます。
この紹介ビデオもご覧 ください
電子メールコンテンツをゼロからデザインするのを避けるために、そのまま使用できるコンテンツテンプレートを使用できます。 詳しくは、「コンテンツテンプレート」を参 照してください

電子メール構造の定義

電子メールデザイナーを使用すると、電子メールの構造を簡単に定義できます。 簡単なドラッグ&ドロップ操作で構造要素を追加したり移動したりすることで、電子メールの形状を数秒でデザインできます。
電子メールの構造を編集するには:
  1. 既存のコンテンツを開くか、新しい電子メールコンテンツを作成します。
  2. 左側の+ア Structure components イコンを選 択して 、を表示します。
  3. 電子メールの形状を決める必要がある構造コンポーネントをドラッグ&ドロップします。
    青い線は、構造コンポーネントをドロップする前に、その正確な位置を具現化します。 上または下に他のコンポーネントの間または内部以外のコンポーネントの間にドロップできます。
    電子メールに配置したコンポーネントは、既にコンテンツコンポーネントまたはフラグメントが内部に配置されていない限り、移動したり削除したりすることはできません。
  4. 1つ以上の列で構成される構造コンポーネントがいくつか使用できます。
    コンポーネン n:n column トを選択して、選択する列の数を定義します(3 ~ 10)。 各列の下部にある矢印を動かして、各列の幅を定義することもできます。
    各列のサイズは、構造コンポーネントの全幅の10%未満にすることはできません。 空でない列は削除できません。
構造を定義すると、電子メールにコンテンツフラグメントやコンポーネントを追加できます。

コンテンツコンポーネントの使用

コンテンツコンポーネントは、電子メールに配置した後に編集できる生の空のコンポーネントです。
構造コンポーネントには、必要な数だけコンテンツコンポーネントを追加できます。 構造コンポーネント内または別の構造コンポーネント内に移動することもできます。
電子メールデザイナーで使用可能なコンポーネントのリストを次に示します。
  • Button
    各ボタンを最初から編集するのではなく、複数のボタンを使用する必要がある場合は、コンテキストツールバーを使用してコ Button ンポーネントを複製できます。
    また、再利用可能なボタンをフラグメントに保存することもできます。 詳しくは、「コンテンツフラグメントの作 成」および「フラグメントとし てのコンテンツの保存」を参照してくださ フラグメントとしてのコンテンツの保存 い。
  1. 電子メー Fallback view ルデザイナーにフォールバック画像を表示する場合に選択します。
  • Text
    このコンポーネントを使用して、電子メールにテキストを挿入します。 では、テキストの色、スタイル、サイズを調整できます Component Settings
  • Divider
    電子メールに分割線を挿入するには、このコンポーネントを使用します。 で区切り線の色、スタイル、サイズを選択できます Component Settings
  • Html
    このコンポーネントを使用して、既存のHTMLの様々な部分をコピー&ペーストします。 これにより、無料のモジュラーHTMLコンポーネントを作成できます。
    無料のHTMLコンポーネントは、限られたオプションで編集できます。 すべてのスタイルがインライン化されていない場合は、HTMLコードの head セクションに適切なCSSを必ず追加してください。追加しないと、電子メールがレスポンシブになりません。 ボタンを使用 Preview して、コンテンツの応答性をテストします(メッセージのプレビ ューを参照 )。
    外部コンテンツを電子メールデザイナーに簡単に準拠させるために、最初からメッセージを作成し、既存の電子メールの内容をフラグメントやコンポーネントにコピーすることをお勧めします。
    再作成できないコンテンツがある場合は、コンテンツコンポーネントを使用して元の電子メールからHTMLコードをコピー&ペースト Html できます。 先に進む前に、HTMLに詳しくあることを確認してください。
    新しいコンテンツは元の電子メールの正確なコピーではありませんが、以下の手順に従って、できるだけ近いメッセージを作成します。
    コンテンツをコピーする前に
    1. 元の電子メールで、送信する各電子メールに固有のセクションから、再利用可能なセクションを特定します。
    2. 使用するすべての画像とアセットを保存します。
    3. HTMLに詳しい場合は、元のHTMLコンテンツを別々の部分に分割します。
  • Video
    このコンポーネントを使用して、電子メールにビデオを挿入します。
    電子メールの構造コンポーネントにビデオコンポーネントを挿入し、にビデオリンクを入力しま Component Settings ​す。
  • Image
    このコンポーネントを使用して、電子メールに画像を挿入します。
    画像コンポーネントを構造コンポーネントに挿入し、「参照」をクリックして、コンピュータから画像ファイルをアップロードします。
  • Social
    このコンポーネントを使用して、電子メールにソーシャルメディアページへのリンクを挿入します。 表示するリンクと、そのアイコンのサイズを選択できます Component Settings
  • Carousel
    1. 構造コンポーネント内にコンポ Carousel ーネントをドラッグ&ドロップします。
    2. コンピューターから画像を参照して選択します。
    3. パネル Settings から、カルーセルに含めるサムネールの数を設定します。
    4. コンピューターからフォールバック画像を選択します。
    カルーセルコンポーネントは、すべての電子メールプログラムと互換性があるわけではありません。 電子メールでカルーセルがサポートされていない場合は、代わりに画像を表示するためのフォールバックをアップロードします。
    カルーセルコンポーネントは、次の電子メールプラットフォームと互換性があります。Apple Mail 7、Apple Mail 8、Outlook 2011 for Mac、Outlook 2016 for Mac、Mozilla Thunderbird、iPadおよびiPad mini iOS、iPhone iOS、Android、AOL(Chrome、FirefoxおよびAri)。
関連トピック