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

最終更新日： 2025年3月19日

作成対象：

  • 初心者
  • ユーザー

メールコンテンツ編集をマスターする方法を説明します。 メールDesignerを使用すると、定義済みのコンテンツの有無に関わらず、メールとテンプレートを作成できます。

以下は、メールDesignerを使用してメールコンテンツをゼロから作成およびデザインする主な手順です。

  1. メールを作成し、そのコンテンツを開きます。
  2. 構造コンポーネントを追加して、メールを形作ります。 メール構造の編集を参照してください。
  3. 構造コンポーネントにコンテンツコンポーネントとフラグメントを挿入します。 詳しくは、 フラグメントとコンテンツコンポーネントの追加を参照してください。
  4. 画像を追加し、メールのテキストを編集します。 画像の挿入を参照してください。
  5. パーソナライゼーションフィールド、リンクなどを追加して、メールをパーソナライズします。 パーソナライゼーションフィールドの挿入、 リンクの挿入および メールへの動的コンテンツの定義を参照してください。
  6. メールの件名を定義します。 メールの件名のパーソナライズを参照してください。
  7. メールのプレビュー。
  8. コンテンツを保存し、オーディエンスを定義し、送信を適切にスケジュールしたことを確認した後、メッセージに進みます。

こちらの 紹介ビデオも確認できます。

NOTE
メールコンテンツをゼロからデザインしないようにするには、標準提供のコンテンツテンプレートを使用できます。 詳しくは、 コンテンツテンプレートを参照してください。

メール構造の定義

E メールデザイナーを使用すると、メールの構造を簡単に定義できます。簡単なドラッグ＆ドロップ操作で構造要素を追加して移動することで、メールの形状を数秒でデザインできます。

メールの構造を編集するには：

  1. 既存のコンテンツを開くか、新しいメールコンテンツを作成します。

  2. Structure components にアクセスするには、左側の「+」アイコンを選択します。

  3. メールを形作るのに必要な構造コンポーネントをドラッグ&ドロップします。

    青い線は、構造コンポーネントをドロップする前の、構造コンポーネントの正確な場所を具体化しています。 他のどのコンポーネントの上、間、下にドロップしても構いませんが、コンポーネント内にはドロップできません。

    NOTE
    列のスタックは、すべてのメールプログラムと互換性があるわけではないことに注意してください。サポートされていない場合、列はスタックされません。
    メールに配置した後は、既にコンテンツコンポーネントまたはフラグメントが内部に配置されていない限り、コンポーネントを移動または削除できません。

  4. 1 つ以上の列で構成される、複数の構造コンポーネントを使用できます。

    n:n column コンポーネントを選択して、列数（3～10）を任意に定義します。 また、各列の下部にある矢印を移動して、各列の幅を定義することもできます。

    NOTE
    各列のサイズは、構造コンポーネントの全幅の 10％未満にすることはできません。空でない列は削除できません。

構造を定義すると、コンテンツフラグメントやコンポーネントをメールに追加できます。

プリヘッダーの使用

プリヘッダーは、インボックスからメールを表示する際に件名の後に表示される短い概要テキストです。 プリヘッダーは、より高い開封率を提供します。

「Preheader」編集ボックスを選択し、コンテンツを入力します。

プリヘッダーコンテンツには、Content block、Dynamic content または Personalization fields を追加できます。

NOTE
プリヘッダーは、すべてのメールプログラムと互換性があるわけではないことに注意してください。サポートされていない場合、プリヘッダーは表示されません。

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

コンテンツコンポーネントは、メールに配置して編集できる生の空コンポーネントです。

構造コンポーネントには、必要な数だけコンテンツコンポーネントを追加できます。 これらは、構造コンポーネント内または別の構造コンポーネントに移動することもできます。

以下は、メールDesignerで使用できるコンポーネントのリストです。

Button

複数のボタンを使用する必要がある場合は、各ボタンを最初から編集するのではなく、コンテキストツールバーを使用して Button コンポーネントを複製できます。

再利用可能なフラグメントにボタンを保存することもできます。 詳しくは、 コンテンツフラグメントの作成および コンテンツをフラグメントとして保存を参照してください。

「Fallback view」を選択すると、メールDesignerにフォールバック画像が表示されます。

Text

このコンポーネントを使用すると、メールにテキストを挿入できます。 テキストの色、スタイル、サイズは Component Settings で調整できます。

Divider

このコンポーネントを使用すると、メールに分割線を挿入できます。 Component Settings で区切り線の色、スタイル、およびサイズを選択できます。

HTML

このコンポーネントを使用して、既存のHTMLの別の部分をコピーして貼り付けることができます。 これにより、無料のモジュラーHTML コンポーネントを作成できます。

NOTE
無料のHTML コンポーネントは、編集できますが、オプションは限られています。 すべてのスタイルがインライン化されていない場合は、HTML コードの head セクションに適切な CSS を必ず追加してください。そうしないと、メールは応答しません。 「Preview」ボタンを使用して、コンテンツの応答性をテストします（ メッセージのプレビューを参照）。

外部コンテンツを簡単にメールDesignerAdobeに準拠させるには、ゼロからメッセージを作成し、既存のメールのコンテンツをフラグメントとコンポーネントにコピーすることをお勧めします。

再作成できないコンテンツがある場合は、Html コンテンツコンポーネントを使用して、元のメールからHTML コードをコピー&ペーストできます。 続行する前に、HTMLについて熟知していることを確認してください。

NOTE
新しいコンテンツは、元のメールの正確なコピーではありませんが、以下の手順に従って、できるだけ近いメッセージを作成できます。

コンテンツのコピー前

  1. 元のメールで、送信する各メールに固有のセクションから再利用可能なセクションを特定します。
  2. 使用するすべての画像とアセットを保存します。
  3. HTMLに精通している場合は、元のHTML コンテンツを様々な部分に分割します。