目次
テンプレートを選択する
「メール/MA」をクリックします
「メールを作成する」をクリックします
右上にある「新規作成」をクリックします
「使用するテンプレート」をクリックします
「GUI編集モードでコンテンツを作成」を選択し、「適用」をクリックします
「GUI編集モードでコンテンツを作成」を選択した場合は、メールコンテンツの作成を開始した後でも「GUI編集モード」から「HTML編集モード」に変更することが出来ます。
一方で、「HTML編集モードでコンテンツを作成」を選択した場合は、メールコンテンツの作成を開始した後に「GUI編集モード」に変更することは出来ません。
また、一度「GUI編集モード」から「HTML編集モード」に変更すると、そこから再度「GUI編集モード」に変更することは出来ませんのでご注意ください。
エディター画面にテンプレートが表示されるので、こちらでメールを編集します
『テキストメール』の作成方法については、「テキストメールを作成したい」をご参照ください。
メール内容を編集する
配信可能なHTMLメール、「HTML/テキストメール」(マルチパート配信)の容量は、「Mail Publisher」が『1MB』、「repica sender」が『150kb』です。ただし、「HTML/テキストメール」につきましては、「HTML」と「テキスト」の合計の容量です。
また、メールの容量が上限を超えた場合、作成したコンテンツは保存されませんのでご注意ください。
※ HTMLメールのサイズ確認の方法についてはこちらの記事をご参照ください
❶ 値を差し込む
下記では「データ」「日付」の2つの値を差し込む方法を紹介します。
「データ」を差し込む
差し込みたい箇所にカーソルを合わせ「データ挿入」をクリックします
「データファイル」を選択し、「適用」をクリックします
差し込み用のデータファイルを選択する画面には、セグメントに使用したデータファイルのみが表示されます。b→dashへのデータ連携と取り込みを行っただけのデータファイルは表示されませんので注意しましょう。
「差し込みたいカラム」を選択し、「適用」をクリックします
メールに差し込みデータ(氏名)が差し込まれます
次にメールに差し込みデータ(保有ポイント)を差し込みます
メールコンテンツの作成時に使用する「データ挿入」機能では、メールの本文だけではなくメールの件名にも値を差し込むことができます。
メールの件名に値を差し込みたい場合は、メール本文に値を差し込む場合と同様の手順を行ってください。メールの件名に値を差し込むと、以下の画像のようにデータ挿入していることを表す「##__DF○○○-××××__##」が表示されます。
20250408_21.png)
「データ挿入」において、使用できる文字は、契約しているメールサーバーによって異なります。
契約しているメールサーバーが『Mail Publisher』の場合、文字コードが「unicode」に対応している文字が使用できます。一方『repica』を利用している場合は、文字コードが「Shift-JIS」に対応している文字が使用できます。
各文字コードで使用できない文字を挿入した場合は、文字化けが発生しますので、ご留意ください。
データ挿入されたカラムの中に「空文字/NULL」が入っている場合、「空文字/NULL」が挿入されるユーザーへの配信をスキップするかどうかは、「共通設定」の「配信制御設定」から設定することができます。
「空文字/NULL」が挿入されるユーザーにメール配信を行いたい場合は、「配信制御設定」を変更する必要があります。
配信制御設定については「配信スキップの設定方法」をご参照ください。
「データ挿入」に使用するデータファイル内において、同じ顧客のレコードが複数ある場合、挿入したいカラム内の「最新のデータ」1つのみが挿入されます。
また「最新のデータ」とは、更新日時が最も新しいデータを指します。ただし、「最新のデータ」かどうかは、データファイルの更新方法や加工/統合の有無によって異なるため、挿入されるデータも異なります。
データファイルを下記の4種類に分けて、挿入されるデータについて説明します。
データファイルの
種類 |
挿入される
データ |
説明 |
差分更新した
データファイル |
更新日時が
最も新しいデータ |
「差分更新」は、更新時に取込まれているデータと連携したデータの差分が生じているレコードを更新します。
差分が生じているレコードのみ更新されるため、データファイル内のレコードの更新日時がそれぞれ異なります。 そのため、更新日時が最も新しいデータが「最新のデータ」となります。 |
全件更新した
データファイル |
ランダム |
「全件更新」は、更新時にデータファイル内のデータをすべて削除し、連携したデータをすべて取込みます。
更新時にデータをすべて取込むため、データファイル内のデータは同じ日時に更新されます。 そのため、データファイル内のデータはすべて「最新のデータ」とみなされるので、どのデータが挿入されるかは実質ランダムになります。 |
加工結果を
新規保存/上書き保存 をして作成した データファイル |
ランダム |
データファイル内のデータは、同じ日時に更新されています。
そのため、データファイル内のデータはすべて「最新のデータ」とみなされるので、どのデータが挿入されるかは実質ランダムになります。 |
統合して作成した
統合データファイル |
「日付」を差し込む
差し込みたい箇所にカーソルをあわせ「日付挿入」をクリックします
「表示形式」を選択します
「プレビュー」から利用したいデザインの日付を選択し、「適用」をクリックします
メールに日付が差し込まれます
❷ 枠を変更する
下記では「枠線を変更する」「角丸を変更する」の2つを紹介します。
枠線を変更する
変更したい箇所にカーソルを合わせ「枠線」をクリックします
枠線の「種類」「太さ」「色」を選択し、「適用」をクリックします
変更した枠線が表示されます
角丸を変更する
変更したい箇所にカーソルを合わせ「角丸」をクリックします
角丸の「px」を入力し、「閉じる」をクリックします
変更した角丸が表示されます
❸ リンクを差し込む
HTMLメールに差し込むリンクの種類は「URL」「メールアドレス」「電話番号」の3つから選択することができます。
下記では「URL」を選択し、リンクを挿入する手順についてご紹介します。
「URL」を反映させたい箇所のテキストを選択します
「リンク挿入」をクリックします
「リンク」を選択し、「適用」をクリックします
ただし、『ディープリンク』が「URLスキーム」の場合、Gmailなどのメーラーでは『ディープリンク』が機能しないため、挿入する『ディープリンク』は、「ユニバーサルリンク」である必要があります。
挿入したい「URL」を入力し、「適用」をクリックします
テキストに「リンク」が挿入されます
クリック計測やCV計測を行うために事前準備が必要です
クリック計測/流入元計測やCV計測を行いたい場合、以下の事前準備が必要です。
それぞれの設定方法については、以下をご参照ください。
- クリック計測/流入元計測:配信パラメータの付与設定
参考:webサイトへの流入元を取得したい
※b→dashのパラメータとUTMパラメータを併用して流入元計測ができます - CV計測:CV設定
参考:webサイトのCVを取得したい
パラメータが付与されたURLが表示されることで、表示崩れが発生する可能性があります
配信パラメータの付与設定を行っており、メール本文にURLを記載していた場合、メール配信時にリンクに配信パラメータが付与されることで、表示崩れが発生する可能性があります。
メール配信時にパラメータが含まれない形でURLを表示したい場合は、入力したURLの文字列に「リンク挿入」を行ってください。
例えば、直接入力した「URL」が『https://example.com』でメール配信時にパラメータが含まれない「URL」を表示したい場合は、直接入力した『https://example.com』の文字列に『https://example.com』を「リンク挿入」してください。
挿入したURLに対して、パラメータの付与を行いたい場合、❶で行った「データ挿入」ではなく「リンク挿入」の「データ挿入」からデータファイルを選択し、URLを挿入することで、自動的にパラメータが付与されます。
20250408_60.png)
❹ テキストを入力/修正する
「フォント」「太字」「斜体」「アンダーバー」「斜線」「文字色」「ハイライト」を変更することができます
コンテンツ内のテキストの「文字色」や「フォント」は一括で変更することはできません。
「文字色」や「フォント」を変更したい場合は、ブロックごとにテキスト要素を選択し、操作してください。
「文字サイズ」「行間」を変更することができます
ブロックの「塗り潰しの色」や、テキストの「配置」を変更することができます
「左右配置」は『左揃え』『左右中央揃え』『右揃え』の3種類、「上下配置」は『上揃え』『上下中央揃え』『下揃え』の3種類があり、全部で6種類です。
例えば、ブロックの左上からテキストを入力したい場合は、左右配置は『左揃え』、上下配置は『上揃え』を選択してください。
「テキスト」を入力/変更します
(貴社のb→dashで利用しているメールサーバーが「Mail Publisher」の場合、テキストに絵文字を使用することができます。)
コンテンツ作成を行う際に、ブロックごとに「テキスト」「画像」「境界線」「ボタン」といった要素を指定しますが、「テキスト」要素においては、以下の上限を超えてしまうと、送信エラーになる可能性がありますのでご注意ください。
- 入力するテキストの容量が「1行の中で800byte」を超えた場合
- 入力するテキストの容量が「1つの要素の中で800byte」を超えた場合
- テキストの文字数が200文字を超えた場合
※b→dashのパラメータ設定において登録しているURLは、配信時にパラメータが付与されるため、コンテンツ作成時にテキストの容量が上限内であっても、配信の際に上限を超える場合があります
[参考] 要素のイメージ
20250408_66.png)
[参考] 要素に「1行 800バイト以上」のテキストを入力したメールコンテンツを保存すると以下のようなエラーメッセージが表示されます
20250408_67.png)
❺ コンテンツを出し分ける
b→dashでは、メールを配信する顧客に応じて、メールに記載する文面内容を出し分けることが出来ます。
右上の「条件分岐」をクリックします
条件分岐を設定する対象を選択し、「適用」をクリックします
「適用」をクリックします
「データファイル」を選択し、「適用」をクリックします
「カラム」を選択します
「条件」を選択し、「適用」をクリックします
条件分岐の設定が追加されます
❻ ボタンを差し込む
❻-① ブロックを追加する
右上の「ブロック追加」をクリックします
「ブロック追加」をクリックします
「px数」を入力し、「適用」をクリックします
❻-② ボタンを追加する
「要素を追加してください」をクリックします
「ボタン」をクリックします
「ボタンのテンプレート」を選択し、「適用」をクリックします
ボタンをクリックした際に「遷移したいURL」を入力します
ボタンが差し込まれます
ボタンを選択すると「変更項目」が表示されます
またボタンのサイズは、追加したブロックのサイズより大きいサイズに変更することができません。
変更したボタンが表示されます
❼ 余白を変更する
変更したい箇所にカーソルを合わせ「余白」をクリックします
余白の「px」の値を入力し、「適用」をクリックします
※余白のサイズ変更は、「上下の余白」と「左右の余白」の組み合わせでのみ、行うことができます
そのため「上部」や「右部分」といった、特定の部分を指定して、余白のサイズ変更を行うことはできません
余白が反映されます
ブロックや余白の幅/高さを変更した場合、直接操作をしていないブロックや余白の幅/高さが変更される可能性があります。ブロックや余白の幅/高さを変更した際の影響について、操作種別に記載していますのでご参照ください。
ブロックの幅/高さを変更した場合
操作対象 |
ブロックに
対する操作 |
要素に与える影響 | |
幅 | 高さ | ||
ブロック
(幅) |
長くした場合 | 長くなる | 影響なし |
短くした場合 | 短くなる | 影響なし | |
ブロック
(高さ) |
長くした場合 | 影響なし | 長くなる |
短くした場合 | 影響なし | 短くなる |
余白の高さを変更した場合
操作対象 | 余白に対する操作 | ブロックに与える影響 | |
幅 | 高さ | ||
余白
(高さ) |
長くした場合 | 影響なし | 長くなる |
短くした場合 | 影響なし | 短くなる |
❽ 画像を差し替える
差し替える「画像」をクリックします
「画像挿入」をクリックします
「コンテンツボックス」をクリックします
「差し替える画像」を選択し、「適用」をクリックします
選択した画像が差し込まれます
コンテンツボックスにアップロードした『.svg』形式の画像をメールコンテンツに挿入し、配信すると、メーラーによってはコンテンツに挿入した画像が表示されない場合があります。
『.svg』形式の画像が表示されない原因については、こちらの記事をご参照ください。
画像の上にテキストを入れたい場合は、画像を先に選択していると行えません。先にテキストを作成しておき、画面の上の項目にある「背景画像」を選択することにより、背景画像として差し込むことで、「画像の上にテキスト」を実現することができます。
メールに差し込んだ画像の表示サイズは、以下2点によって決定されます。
※データ挿入で差し込んだ画像URLが画像ファイルとして表示される際も、下記の表示サイズが適用されます
20250408_107.png)
① 差し込むブロックの数
b→dashで作成するメールコンテンツの横幅は600pxに設定されているため「600px」を「横方向に設定したブロックの数」で除算したpxサイズが、画像1枚あたりの”最大”横幅サイズになります。
例えば、1ブロックしか利用しない場合の画像の最大横幅は600px、横方向に2ブロック作成した場合の画像1枚あたりの最大横幅は300px、横方向に3ブロック作成した場合の画像1枚あたりの最大横幅は200pxになります。
【1ブロックしか利用しない場合の画像あたりの横幅イメージ】
20250408_108.png)
② 画像ファイルの元データにおける横幅
「①差し込むブロックの数」で決定した横幅は、”最大”の横幅に過ぎず、実際の横幅がどれくらいになるかは、画像ファイルの元データにおける横幅を参照して決定されます。
例えば、1ブロックしか利用しない場合の”最大”の横幅は600pxになりますが、画像の元データファイルの横幅が600pxより小さい場合は、画像の元データファイルの横幅が利用されます。
逆に、画像の元データファイルの横幅が600pxより大きい場合は、画像の元データファイルの横幅が600pxまで縮小されます。※縦横のアスペクト比は維持された形で縮小されます。
【1ブロック利用時(最大横幅600px)に、横幅300pxの元データファイルを差し込んだ場合】
20250408_109.png)
【1ブロック利用時(最大横幅600px)に、横幅1,200pxの元データファイルを差し込んだ場合】
20250408_110.png)
b→dashで作成するメールは画像そのものの添付ではなく、画像リンク先のデータを参照することで画像を表示させています。メールコンテンツには1通あたり150KBというサイズ上限がありますが、画像については参照して表示させている関係上、この150KBの中に画像サイズはカウントされません。
メールコンテンツで挿入することができるコンテンツボックスは画像ファイルのみのため、動画を埋め込むことができません。メールで動画を案内したい場合は、外部サイトに動画をアップロードしてサイトURLを添付していただく対応をお願いいたします。
❾ 画像を削除する
3段目の写真とテキストを「削除」します
「削除する箇所」をクリックします
「ゴミ箱」アイコンをクリックします
「削除」をクリックします
選択した箇所が削除されます
3段目の写真とテキストを全て削除します
❿ 定型文を差し込む
差し込みたい箇所にカーソルを合わせ「定型文挿入」をクリックします
「挿入したいテキスト」をクリックします
メールに定型文が差し込まれます
定型文の編集は、「コンテンツボックス」アプリで行ってください。
件名を入力する
「件名」を入力します
(貴社のb→dashで利用しているメールサーバーが「Mail Publisher」の場合、件名に絵文字を使用することができます。)
HTMLメールの「GUI編集モード」では、プリヘッダーに任意のテキストを設定することができます。
※ プリヘッダーについては、「マーケティング用語集:プリヘッダー」をご参照ください
プリヘッダーを設定したい場合は、「プリヘッダーの設定アイコン」をクリックし、テキストを入力してください。
ただし、本機能は、メール配信サーバー『Mail Publisher』をご利用の場合にのみ、利用可能です。
プリヘッダーを設定する手順については、以下をご参照ください。
プレビューで確認する
「プレビュー」をクリックします
コンテンツに起因したエラーが発生した場合、「プレビュー」をクリックしても、プレビューが表示されません。
コンテンツが正しく表示されない旨のエラーモーダルが表示されます。
具体的には、以下の内容をエラーモーダルで確認することができます。
【プレビューボタン押下時】
●コンテンツ内のデータ挿入に存在しないカラムIDを指定している
●コンテンツ内にサイズが『0px』の画像が存在している
プレビューが表示されるので、差し込みなどが表示されているかを確認します
プレビューの変更例、スマホ画面
メールコンテンツの表示崩れの詳細については「環境によるHTMLメールの表示の違いを知りたい」をご参照ください。
メールコンテンツに利用している画像のURLが「http」になっていないかご確認ください。
プレビュー画面はwebブラウザ上で表示をしていますが、ブラウザにChromeを利用している場合は、Chromeの仕様により、画像のURLが「http」の場合、自動で「https」に変換されるため、画像URLが「http」の場合は表示が出来ません。
ただ、あくまでもブラウザ上では画像が表示されないだけであり、画像URLが「http」の状態でメールを配信しても、メール受信者のメーラー上は正常に画像が表示されるケースが多いです。
これらを踏まえ、以下のいずれかの対応策を検討いただきますようお願いいたします。
- プレビューでの表示確認はせず、テスト配信による画像表示確認のみ行う
- プレビューでの表示確認をするため、画像をb→dashコンテンツボックスにアップロードして、メールコンテンツに画像挿入をして頂く
- プレビューでの表示確認をするため、「http」のサイト上に設置されている画像ファイルを「https」のサイトに設置いただき、「https」で始まる画像URLをメールコンテンツに挿入頂く
プレビューの確認が出来たら「保存」をクリックします
任意の名前を入力し、「適用」をクリックします
コンテンツの「本文」または「件名」に『制御文字』が含まれている場合、「保存」をクリックしても、コンテンツを保存することができず、エラーとなります。
※『制御文字』とは、コンピューターで文字を扱う際に、「改行」などを制御する文字のことです
『制御文字』が含まれている場合に表示されるエラーモーダルと、コンテンツを保存することができない『制御文字』については、以下をご参照ください。
コード | 値 |
制御文字
(エラー対象) |
制御文字の説明 |
0 | NUL | ^@ |
NULl
(ヌル) |
1 | SOH | ^A |
Start Of Heading
(ヘッダ開始) |
2 | STX | ^B |
Start of TeXt
(テキスト開始) |
3 | ETX | ^C |
End of TeXt
(テキスト終了) |
4 | EOT | ^D |
End Of Transmission
(転送終了) |
5 | ENQ | ^E |
ENQuiry
(問合せ) |
6 | ACK | ^F |
ACKnowledge
(肯定応答) |
7 | BEL | ^G |
BELl
(ベル) |
8 | BS | ^H |
Back Space
(後退) |
0B | VT | ^K |
Vertical Tabulation
(垂直タブ) |
0C | FF | ^L |
Form Feed
(改ページ) |
0E | SO | ^N |
Shift Out
(シフトアウト) |
0F | SI | ^O |
Shift In
(シフトイン) |
10 | DLE | ^P |
Data Link Escape
(伝送制御拡張) |
11 | DC1 | ^Q |
Device Control 1
(装置制御1) |
12 | DC2 | ^R |
Device Control 2
(装置制御2) |
13 | DC3 | ^S |
Device Control 3
(装置制御3) |
14 | DC4 | ^T |
Device Control 4
(装置制御4) |
15 | NAK | ^U |
Negative AcKnowledge
(否定応答) |
16 | SYN | ^V |
SYNchronous idle
(同期信号) |
17 | ETB | ^W |
End of Transmission Block
(転送ブロック終了) |
18 | CAN | ^X |
CANcel
(取消) |
19 | EM | ^Y |
End of Medium
(媒体終端) |
1A | SUB | ^Z |
SUBstitute
(置換) |
1B | ESC | ^[ |
ESCape
(拡張) |
1C | FS | ^\ |
File Separator
(ファイル分離) |
1D | GS | ^] |
Group Separator
(グループ分離) |
1E | RS | ^^ |
Record Separator
(レコード分離) |
1F | US | ^_ |
Unit Separator
(ユニット分離) |
7F | DEL | ^? |
DELete
(削除) |