サポートページ aero-right HTMLコード

登録フォームの作り方は?

登録フォームは、ウェブサイトやブログ、ソーシャルメディアプラットフォームで購読者を効果的に獲得できる方法です。ここでは、登録フォームの種類や作成方法などをご説明します。 目次 登録フォームのタイプ 登録フォームの作成方法 スライド資料(PDF) 登録フォームのURLを取得する方法 WordPressプラグインで登録フォームを設置   登録フォームのタイプ ・埋込型フォーム(多項目):従来の埋込型フォームより自由なカスタマイズが可能 ・ポップアップフォーム:ページ閲覧中に表示させるポップアップ登録フォームの作成、カスタマイズ ・埋込型フォーム:フッターやサイドバーに埋め込めるシンプルな登録フォーム ・連携フォーム:プラグインを利用した登録フォーム 登録フォームの作成方法 1. 左のダッシュボードメニューより「コンタクトリスト」>「登録フォーム」を選択 2. ページ右側の「登録フォームの作成」をクリック 3. 登録フォームのタイプを選択し「次へ」をクリック 4. 登録フォームの作成・編集 ・登録フォームの各セクションにカーソルを合わせると、左側に緑色の「︙」が表示されますのでクリックします。フォーム項目の追加やデザインの変更などカスタマイズが可能です。 ・「登録ステップの設定」をクリックすると、オプトイン設定や登録確認メールの編集が可能です。詳しくはFAQをご覧ください。 FAQ:オプトイン完了 / オプトイン未完了とは何のことですか? ・「登録ステップの設定」の下に灰色で表示された「標準設定」ボタンをクリックすると、以下の項目の編集が可能になります。 幅変更:バーを右にスライドし、登録フォームの横幅を変更することができます。 背景色:クリックするとカラーパレットが表示されますのでお好きな色を選択します。また、CSSカラー(HEX値)を直接入力することも可能です。 ボーダー:pxの数字が大きいほど、外枠の幅は大きくなります。色の変更も可能です。0のままですと、外枠は無い状態です。 コーナー半径:登録フォームの四隅を丸くすることができます。pxの数字が大きいほど角は丸くなります。(以下の例:20px) reCAPTCHA:右にスライドすると、reCAPTCHAがオン(青色)に、灰色はオフの状態です。 Benchmarkリンク:リンクを登録フォームの下に表示することができます。スライドバーで切り替えが可能です。 デザイン例:フォントの色やサイズから登録ボタンの大きさまで簡単にカスタマイズできます。画像の挿入も可能です。 5. 編集完了後、「保存&出力」をクリック>フォーム出力画面が表示されるので、「次へ」をクリック 6. 登録フォームコードがポップアップで表示されるので、ドロップダウンでコードタイプを選択 7. 「コピー」をクリックして、ウェブサイトに掲載 各種登録フォームの作成方法の詳細は、以下のスライド資料(PDF)をご覧ください。 スライド資料(PDF):登録フォームの作成 注意点: ・無料アカウントご利用のお客様は1日に75件まで、有料アカウントのお客様は無制限に登録可能です。 ・ご契約プラン数を超えて登録された場合、アカウントが正常に機能しない事がございます。必ず適切なプランへアップグレードを行って下さい。 ・旧インターフェースをお使いのお客様は、埋込型フォーム(多項目)はご利用になれません。 ・新インターフェースでは、「クラシックフォーム」は「埋込型フォーム(多項目)」に変更されました。クラシックフォームの全機能は「埋込型フォーム(多項目)」でご利用できます。 ・オプトインアラートを設定すると、登録のあったフォーム名がお知らせメールの件名に表示されます。 ・登録フォームからメールアドレスが追加されることによって、ご契約のリストプラン数を超過する可能性がある場合は、必ず事前にアップグレードをお願いします <登録フォーム設置後に、デザインや設定を変更した場合について> Javascriptコード(トラッキング付きも含む):自動的にウェブサイトの登録フォームに反映されますので、コードを更新する必要はありません。 HTMLコード(トラッキング付きも含む):自動的にウェブサイトの登録フォームには反映されません。変更後、再度登録フォームを保存し公開する必要があります。新しいHTMLコードをコピーし、ウェブサイトへ貼り付けを行なってください。この作業は、コードを変更・更新毎に行う必要があります。 登録フォームページのURLを取得する方法 「埋込型フォーム(多項目)」形式で作成したフォームは、独自ページとしてBenchmark Emailサーバー上に作成されます。 URLは下記の方法で取得することができます。 1. 埋込型フォーム(多項目)を作成 2. 「STEP2 デザイン」段階へ進む 3. 「公開用URL」をクリック 4. 「公開用URL」ウインドウ内の登録フォームURLをコピー *2018年9月より、中国本土で多数のGoogle関連サービスに制限がかかっており、一部地域にてreCaptcha機能がご利用頂けませんのでご注意ください。 WordPressプラグインで登録フォームを設置 WordPressで制作されたサイトをお持ちの場合は、WordPressプラグイン「Benchmark Email Lite」でサイトのデザインに合わせた登録フォームを簡単に作成・設置することができます。 詳細は以下のブログをご参照ください。 ブログ記事: WordPressプラグインでメルマガ配信する方法を図解してみた なお、登録フォームのデザインについての記事は以下をご覧ください。 ブログ記事:メルマガ登録フォームはWebサイトのデザインを壊さずに目立つのが大事   ご不明な点がございましたらこちらよりサポートチームにお問い合わせください。     >>「登録フォーム」のまとめページに戻る

登録フォーム 1月 21, 2022

メールクライアントによってHTMLメールがうまく表示されないのはなぜですか?

メールクライアント(Gmail、YahooやOutlookなど)やブラウザは、Benchmark Emailからの配信メールのHTMLコードをそれぞれ異なった形で解読・表示します。 メールがどのように表示されるかは受信側のメールクライアントまたはブラウザによって異なり、コードに異常がある場合は、受信環境によっては正しく解読できないことがあります。 例えば、Gmailでは簡単に修正できる問題であっても、Outlookでは修正ができずにレイアウトが崩れることがあります。このような場合のメール表示トラブルはその特定の受信環境に限られることになります。 他の例として、一部のテキストがOutlook上では全て左寄りで表示されていたとしても、他のメールクライアントでは中央寄りに表示されることがあります。 このような問題が発生した場合、受信テスターをご利用頂き、さまざまなメールクライアントやブラウザでの表示を確認してから本配信を行うことをお勧め致します。詳細は以下のFAQをご覧ください。 FAQ:受信テスターの目的と作成方法について なお、メールクライアントによってはESP(メールサービスプロバイダー)が回避できない制限がある場合がございます。以下、受信環境に関わらずメールを同じように表示するためのポイントをご紹介します。 受信環境に左右されないメールを作成するポイント ドラッグ&ドロップエディタを使用する – ドラッグ&ドロップエディタのメールテンプレートは全てモバイル(スマホ)対応となっております。こちらのエディタを使用することで受信環境に最適なメールが表示されるようになります。 メール内にWebページ版リンクを設置する – 受信環境によってはメールが正しく表示されない場合があるため、Webページ版リンクを設置することにより同一の内容を閲覧して頂けます。設定はメール編集画面の「パーミッションリマインダーブロック」から可能です。Webページ版リンクの挿入方法についてはこちら 画像の背景色に気をつける – 画像の背景色はメールソフトが画像を表示できない場合にディスプレイされるため、メールが真っ白に表示されないように文章のフォントの色が目立つような背景色を選択しましょう。 画像の代替テキストを追加する – 画像の代替として表示されるテキスト「代替テキスト(Alt属性)」をメール本文に追加されることをお勧め致します。購読者によっては受信箱で画像をブロックまたは非表示設定している場合があるため、画像無しでもメールを読んで頂けるように代替テキストを追加しましょう。代替テキストを追加するには、画像をダブルクリックしボックスに入力するだけです。詳細はこちら 画像の配置 – 場合によって、画像が大きすぎてテキストを覆ってしまったり、圧縮されているように見えたりすることがあります。 画像の位置を調整し、サイズを縮小してフォーマットを綺麗にしてください。 ドラッグ&ドロップエディタをお使いの場合は、この作業は自動で行われますのでご安心ください。 テキストブロックに直接長いURLを挿入しない – スペースを含まない過度に長い文章(テキストブロックに直接追加した長いURLなど)は、文字列がメールの幅を超えてしまう可能性があります。途切れないようにするには、単語、文章または画像にリンクを挿入してください。ドラッグ&ドロップエディタのメニューバーにあるBenchmark Emailのリンクツールをご利用ください。リンクの挿入に関するFAQはこちら 以上を踏まえた上でメールを作成後、ご自身または身近な人にテストメールを送ってみましょう。複数のデバイスでメールを開いてデザインがどのように表示されるかを確認しましょう。最後に、各メールクライアントで確認されている表示エラーの一覧表を記載しておりますので、こちらも併せてご参照くださいませ。 各メールクライアントでの表示エラーリスト   メールクライアント HTML 対応 仕様 AOL 4.0、5.0 未対応 テキスト対応のみ フォーム認識不可 AOL 6.0、 7.0、8.0 対応 スタンダードHTML フォーム認識不可 外部スタイルシートへのリンク入りメール受信不可 AOL 9.0 一部対応 HTML画像&直リンク表示不可 フォーム認識不可 長いメールはzipファイルになる AOL Webメール 一部対応 XHTMLフル対応無し <br />タグ認識不可 アンカータグ対応無し -アンカーリンクをクリックするとアンカー箇所に飛ばず新しいウィンドウで受信箱が開く Apple Mail 対応 スタンダードHTML フォントタグ使用不可 - <span>タグを使用 アンカーリンクはダブルクリックが必要 El Capitan OSXではアンカーリンクが機能しない Compuserve 未対応 テキスト対応のみ Comcast Smartzone 対応 スタンダードHTML 背景画像はブロックされる アンカータグ対応無し -アンカーリンクをクリックするとアンカー箇所に飛ばず新しいウィンドウで受信箱が開く Comcast XFinity 一部対応 長いメールは途中で切れる - ウェブページバージョンで閲覧するよう誘導するか、メールを短くする必要あり アンカーリンク、目次リンクをクリックするとアンカー箇所に飛ばず新しいウィンドウで受信箱が開く Entourage (Mac) 対応 スタンダードHTML Entourage 2008 (Mac) 一部対応 背景画像がブロックされる場合がある フォーム、Flash、その他プラグイン、CSS float、CSSポジショニング、GIF対応 箇条点は画像に置き換えられる Earthlink 一部対応 テキストに下線が入る場合がある Eudora 3.1 未対応 テキスト対応のみ Eudora 4.0、4.2、4.3、 5.0 未対応 Internet Explorer使用の場合、スタンダードHTML仕様 デフォルトのEudora HTMLビューアでは正常に表示されない場合がある Gmail 一部対応 ブックマークアンカーのサポート無し 長いメールは途中で切れる - ウェブページバージョンで閲覧するよう誘導するか、メールを短くする必要あり メール内の電話番号がハイパーリンクになる Hotmail 一部対応 デフォルトで画像ブロック  <head>, <title>, <meta>, <body> タグ使用不可 - インラインスタイルの使用が必要 ホットリンクは4分後に無効になり、背景画像が削除される - メール認証設定をONにする必要あり CSS表示問題 テキストに下線が表示される場合あり <p>タグで囲んだテキストの行間に余分なスペースが入る - ブロックのコードビューで<p>タグを<div>ダグに変更するか、新規ブロックを作成し、コピー&貼り付けせずにテキストを入力する必要あり Juno 4.0、 5.0 対応 スタンダードHTML(大部分) CSS表示問題 Lotus Notes 4.6 未対応 フォント、リンクカラーが反映されない Lotus Notes 5.0 対応 スタンダードHTML(大部分) CSS表示問題 Novell GroupWise 5.5 対応 スタンダードHTML Office 365 一部対応 スタンダードHTML デフォルトで画像ブロック CSS表示問題 アンカーリンク、目次は機能しない 画像はライブラリに保存されたオリジナルファイルのサイズで表示されるため、表示問題を防ぐため画像のリサイズが必須 Outlook 97 一部対応 フォント、リンクカラーが反映されない 段落揃え未対応 Outlook 98、 2000 対応 スタンダードHTML CSS未対応 Outlook 98、 2001 (Mac) 未対応 リッチテキスト形式のみ Outlook 2003 一部対応 デフォルトでHTML画像のブロック Outlook 2007、2010 一部対応 フォーム、Flash、その他プラグイン、CSS float、CSSポジショニング、GIF未対応 箇条点は画像に置き換えられる 長いメールにはページ区切りが挿入され空白が表示される場合あり 画像ボーダー表示未対応 1920px x 1080px 以上の高画質ではテキストフォーマット対応、画像は未対応 画像キャプションスタイルはOutlookスタイルに上書きされる 縦1728 px以上の画像は切れる 段落の間、テキストの間に余分な空白が入る パソコン表示設定では画像がうまく表示されない場合がある 注: Microsoft ではOutlook 2007でのHTML認証ツールを提供しています。 Outlook 2007、2010 (Mac) 一部対応 アンカーリンク、目次は機能しない アニメGIF未対応 Outlook 2013、2016 一部対応 長いメールにはページ区切りが挿入され空白が表示される場合あり ブロックの最後のテキストが行頭文字の場合、中央が空欄スタイルの行頭文字が追加される - 行間文字を最後に置かないようにするか、</ul>タグでクローズする前に <div style="display:none;">&nbsp;</div> を追加 1920 x 1080 px以上の高画質ディスプレイではテキストサイズは調整されるが、画像サイズは調整されない パソコン表示設定によっては画像が正常に表示されない場合がある アニメGIF未対応 Outlook 2016 (Mac) 一部対応 アンカーリンク、目次機能は未対応 Outlook 365 一部対応 リンクに続くテキストのカラーを設定しない限りリンクはデフォルトで青になる - リンクは<span> タグで囲み、 <td> と <div>タグは異なるカラー設定が必要 アンカーリンク、目次リンクをクリックすると正しい箇所に飛ばずブランクのWebページが開く テキストは左寄せに設定していても、デフォルトで両端揃えになる 画像周りのスペースは設定が反映されない Outlook Web Access 一部対応 スタンダードHTML 画像はデフォルトでブロックされる アンカーリンク、目次は機能しない 画像はライブラリに保存されたオリジナルファイルのサイズで表示されるため、表示問題を防ぐため画像のリサイズが必須 Outlook Express- PC or Mac 対応 スタンダードHTML Pegasus Mail 3.1- Windows 対応 スタンダードHTML リンクのカラー設定は反映されない スマートフォン Android、 iPhone等 対応 電話番号がハイパーリンクとして表示される(クリックして電話が可能) メールフッターの住所を認識し、イベント日時をカレンダーに追加可能 Verizon 対応 スタンダードHTML アンカーリンク、目次は機能しない Yahoo! 対応 スタンダードHTML アンカーリンク、目次が機能しないブラウザがある - 機能しないブラウザではメールが閉じ受信箱ページへ戻る動作となる 長いメールは途中で切れる - ウェブページバージョンで閲覧するよう誘導するか、メールを短くする必要あり 参照元: StudioCloud ご不明な点はサポートまでご連絡ください。     >>「メール作成:設定管理」のまとめページに戻る

到達率 5月 23, 2021

ドラッグ&ドロップエディタのコードを編集する際のテクニック集

ドラッグ&ドロップエディタにおいてHTMLコードを部分的に編集し、デザインの変更などを行う方法を解説しています。 「該当するブロックのコードを参照する」方法は以下のFAQにて確認しておいて下さい。 FAQ:ドラッグ&ドロップエディタで作成したメールのHTMLコードを参照できますか?   目次  リンクの色を変更する方法/リンクの下線を表示しない方法/アンカーリンクを付け加える方法  フォントの色を変更する方法/リンクの色を変更する方法  複数の画像を並行設置する方法   カスタムHTMLを利用する際に知っておくべきこと  HTMLを使ってメール内にコンタクトの名前を表示させる方法  自分で編集した項目名をメール編集中に使う方法  フィールド項目に登録されているURLを利用して、項目名にハイパーリンクを挿入させる方法  受信者ごとに異なる内容が表示されるメールを作成する方法  箇条書きテキストの色の変更方法  メールの編集がうまくいかない場合  行間の幅を調整する方法  テキストを上付き、下付きに変更する方法  特別な文字やシンボルを使用する方法  段落ごとに文字列を「右に揃える」「左に揃える」「中央に揃える」方法   リンクの色を変更する方法/リンクの下線を表示しない方法/アンカーリンクを付け加える方法 リンクの色を変更する方法 アップデートしたいURLを入力してください。 HTMLコードの<a href>タグをフォントタグで囲むか、タグのスタイル属性を変更してください。 色(#FF0000=red)、変更を行うと以下のようになります。 <font color=red><a href="xyz">mycompanyname.com</a></font> <a href>タグの中にスタイル属性を挿入する場合、以下のようになります <a href="xyz" style="color:#FF0000">mycompanyname.com</a> 保存、もしくは更新をクリック リンクの下線を表示しない方法 該当するリンクが含まれるブロックのHTMLコードを参照する。 先程の入力したURLが表示されているテキストを探してください。 以下例となります, http://www.benchmarkemail.com/ExtPricing. <a href="http://www.benchmarkemail.com/ExtPricing">Benchmark Email Pricing Plans</a> "text-decoration:none"をタグの最後に加えてください。 下記のようになります。 <a href="http://www.benchmarkemail.com/ExtPricing" style="text-decoration:none!important;">Benchmark Email Pricing Plans</a> 保存&閉じるをクリックします。 アンカーリンクを付け加える方法 アンカーを設置し表示したいブロックのHTMLコードを参照します。 Name要素をアンカーとして付け加えましょう。以下は一例です。 <a name="disc">This Week's Discounts</a> 保存&閉じるをクリックします。 ブロック編集が終了したら保存をクリックします。 次に、アンカーリンクを設置したいブロックのHTMLコードを参照します。 タグに#と先ほど設定した名前を加えて、以下例のようにアンカーリンクを作成します: <a href="#disc">discounts</a> 保存&閉じるをクリック。 ブロックの編集が終了したら保存をクリック。 すべての編集が終了したら画面上部の更新ボタンをクリックして保存してください。プレビュー画面を表示し、挿入したコードが機能しているのか確認を行ってください。 トップに戻る フォントの色を変更する方法/リンクの色を変更する方法   フォントの色を変更する方法 色を変更するブロックのHTMLコードを参照します。 変更を行う文章を探し、希望の色番号を入力してください。 以下の例では、「メール編集機能について」という文章の色を#fc6462と指定します。 <span style="color:#fc6462;">メール編集機能について</span>   リンクの色を変更する方法 ブロックのHTMLコードを参照します。 編集を行いたいURLを探してください。 タグ、色コードが入力されているスタイル属性に変更を加えましょう。 例:以下サンプル内の色コード(FF0000、red)を希望する色の名前に差し替える、または16進コードを入力してください。 mycompanyname.com 上記のコードをスタイルタグで囲います: <font color=red><a href="xyz" style="color:#FF0000">mycompanyname.com</a></font> もしくは以下のように挿入してください: <a href="xyz"><font color=red>mycompanyname.com</font></a> 「保存&閉じる」をクリックします。 ブロックの「保存」をクリックします。 トップに戻る 複数の画像を並行設置する方法 編集するテキストブロックをクリックし、編集可能な状態にします。 画面上部の編集メニューから、HTMLコード確認アイコンを選択してください。 下記のコードをコピーし、すでに表示されているコードに上書きしてください。 (この作業はブロック内のコンテンツに上書きされます。) <table width="100%"> <tr> <td> image 1 </td> <td> image 2 </td> <td> image 3 </td> </tr> </table> <td> image # </td>のコードが複数あることからお分かりいただけるかもしれませんが、これらのコードは3つの画像を挿入する枠の役割をします。 目的によって数を増やす、減らすを行ってください。 「保存&閉じる」ボタンをクリックします。 以下のようにimage1、image2、image3とセクションが用意されます。 Image1をクリックしハイライトしてください。 編集オプションより画像挿入アイコンをクリックします。 画像ギャラリーより任意の画像を選択してください。 挿入をクリックします。 必要に応じて画像のサイズを変更してください。(テンプレート内の最大幅は600となっております) image 2 とimage 3も上記の6から11までのステップを繰り返し行い、画像を挿入してください。 画像をそれぞれ選択し、中央寄せボタンを押してください。 保存をクリックして完了です。 トップに戻る カスタムHTMLを利用する際に知っておくべきこと コンテンツを挿入する場合、Spaceタグで行を空けるのではなくTableタグを利用してください。 メーラー、メールソフトではインライン記述以外のCSSが無効となってしまいます。このため、Benchmark Emailではメール内のCSSに関してはインラインのみのコーディングを行っていただいております。 MSワードなどの外部ソースからのテキスト、画像の参照は行わなず、直接ペーストも行わないでください。 代わりにNotepadへペーストし、そこから編集画面に入力してください。 メールの一番良いバランスはテキスト60%、画像40%となります。 不必要なタグの重複は削除してください。 スクリプト言語の書き込みはやめてください。 <p>タグの使用は控え、代替として<br>を使ってレイアウトの調整を行ってください。 迷惑メールと判断されるリスクが高いため、背景に画像を使用するのは控えてください。 600x800内でメールのデザインは行ってください。 トップに戻る HTMLを使ってメール内にコンタクトの名前を表示させる方法 デフォルトのパーソナライズ機能やグリーティング機能を使うのが難しい、条件に合わないなどといった場合はHTMLを使いましょう。 編集を始めるブロックを選択し、グリーティング用の言葉や個別の挨拶を入力してください。 画面上部の編集メニューから、HTMLボタンを選択してください。 グリーティングテキストを選択します。 次のコードを貼り付けしてください: [contact_attribute:firstname] 「保存&閉じる」ボタンをクリックします。 このコードは呼び起こすデータ(Firstname)などの情報がない限り表示されません。 コード[contact_attribute:firstname]の後ろにコンマ,を入力してください。 あとはほかのテキストを入力して完了となります。 「保存」ボタンをクリックします。 トップに戻る 自分で編集した項目名をメール編集に使う方法 パーソナライズ機能以外ではHTMLを編集することで代替が可能となります: 編集を行いたいブロックを選択します。 すでに入力されているデフォルトのテキストを削除します。 任意のテキストを入力してください。 ブロックのHTMLコードを参照して下さい。 テキストの前にカーソルを合わせ、表示したいコンタクト情報を入力してください。 テキストから一文字分離し、次のコードをコピー&ペーストしてください: [contact_attribute:FIELDLABEL] [contact_attribute:FIELDLABEL]内のFIEDLLABELを任意のフィールド項目名に変更してください。 (法人名、役職名、携帯電話など) 「保存&閉じる」ボタンをクリックします。 このコードは受信先で呼び起こすデータ(Firstname)などの情報がない限り表示されません。 先程のコード[contact_attribute:firstname]の後ろにコンマ,を入力し一文字間をあけてください。 残りの文章を入力してください。 「保存」ボタンをクリックします。 トップに戻る フィールド項目に登録されているURLを利用して、項目名にハイパーリンクを挿入させる方法 フィールド項目を挿入するブロックを選択します。 テキストを入力してください。 ブロックのHTMLコードを参照して下さい。 先程入力したテキスト後ろにカーソルを合わせて下さい。 最後の文字から一字開けて、以下のコードを挿入してください。(赤字に該当するフィールド項目名を入力してください): <a href="[contact_attribute:field name]" target="_blank"> [contact_attribute:field name] </a> 最初のfieldnameをURLが入力されているフィールド項目名に変更してください。 次のfieldnameをテキストとして表示される内容が登録されているフィールド項目名に変更してください。 トップに戻る 受信者ごとに異なる内容が表示されるメールを作成する方法 同じリスト内の購読者に異なった内容のメールを送信したい場合は、条件別コンテンツ表示タグを利用することで可能になります。例えば、関東にお住いの方には東京のイベ

General Questions 9月 15, 2021

購読者毎の情報をメールや件名に差し込む方法(パーソナライズ機能)

パーソナライズ機能を使ってメルマガの中でリストに保存された顧客情報を反映させることが可能です。名前、電話番号、カスタマーIDナンバーなど、どの項目でもコンタクトリストにある情報は差込むことができます。 ※複数のリストへ配信する場合は、各リストでフィールド名を統一して設定したか確認してください。  例:「国」「国1」「Country」「国籍」「くに」など別の名前に設定していると、機能しません。 目次 ドラッグ&ドロップでパーソナライズ機能を設定する方法 件名をパーソナライズする方法 グリーティング挿入機能を使って名前や挨拶文を添える方法 リンクURLにパーソナライズ情報を追加する方法 コンタクトを指定してプレビューを表示する方法 受信メールの宛先欄に「様」などの敬称を表示させる方法       ドラッグ&ドロップでパーソナライズ機能を設定する方法 1. ダッシュボード左のメニューよりメール>メールをクリックし、編集したいメールをクリックします。 2. メール作成チェックリストの中から、本文&デザインをクリックします。 3. パーソナライズ化したいテキストブロックを選択します。 4. 右上のメニューをクリックし、挿入機能をクリックします。 5. ドロップダウンより「パーソナライズ」を選択します。 5. 配信先の顧客リストにある情報が個々に反映されます。(例:「名」を選択すると、個々の名前がテキストボックス内に表示されます。) 顧客リストのフィールド項目に保存されていれば、どのような情報であってもメールが配信される際に置き換えられます。 下記の例をご参照ください: [contact_attribute:姓]様,: 例えば田中太郎さんがメールを受け取った場合、"田中様"と表示されます。 連絡先の詳細が存在しない場合、フィールドは空白になります。 プレビューにて、連絡先の詳細が置き換えられているかどうかを確認することができます。 Benchmark Emailにおいて使えるタグ一覧は以下のFAQをご確認ください。 FAQ: BenchmarkEmailで利用可能なタグ一覧 トップに戻る     件名をパーソナライズする方法 Benchmark Emailはメールの件名に受信者の名前を追加する事は推奨しておりません。迷惑メールは件名に個人情報を利用する事多いため、追加をする事で迷惑メール報告率の増加に繋がる可能性があります。 以上を踏まえた上で、パーソナライズを利用する場合は以下の手順に従ってください。 ・件名に直接、登録情報表示をしたい部分に[contact_attribute:項目名]と入力する。 ・項目名の部分に、リスト内の表示させたい項目名を入れる。 例)件名に名前を表示させたい場合 「[contact_attribute:last name] 様、新商品のご紹介です」と入力します。 *タグは下記のように日本語表記でも可能です。 名:[contact_attribute:名] 姓:[contact_attribute:姓] 田中太郎様がメールを受信した際には、件名には「田中様、新商品のご紹介です」と表記されます。 注意: ・メールアドレスの項目のみ日本語表記が使用できない仕様となっております。 メールアドレスの項目につきましては、こちらのタグをご使用くださいませ:[contact_attribute:email] ・タグの項目名を英語で入力する際は、項目名が「first name」や「Extra 3」など複数の単語で構成されている場合、必ず単語の間にスペースを入れてください。スペースを削除すると、タグが正常に反映されません。  正しい書き方:[contact_attribute:first name]   誤った書き方:[contact_attribute:firstname] ・タグ付けしたフィールド項目名がリストに登録されていない場合は、パーソナライズしたタグは反映されません。 ・プレビュー画面では件名部分は反映されません。 ・件名のパーソナライズの反映を確認するには、ご自身のメールアドレスに実際にメールを配信してください。テストメールでも、配信リストに登録されているアドレスに送信した場合は反映の確認が可能です。 トップに戻る     グリーティング挿入機能を使って、名前や挨拶文を挿入する方法 グリーディング挿入機能を使って、購読者の名前と挨拶/グリーティングを添えることができます。 併せて、登録されているコンタクトの姓、名、もしくはフルネームをメール内に表示できます。またコンタクト情報が登録されていないメールアドレスには、代替挨拶文を表示させることも可能です。 1. Benchmark Emailアカウントにログイン 2. メール→メールをクリックし、ドラッグ&ドロップを選択 3. 本文&デザインの編集画面で、グリーティング機能を使いたいブロックをクリック 4. ブロック内で挨拶を添えたい場所をクリック 5. 右上の メニュー> 挿入機能> グリーティング挿入をクリック 6. メイングリーティングで挨拶を入力し、表示したいコンタクト項目をドロップダウンメニューから選択します。注:初期設定ではDearと入力されています。必要に応じて変更して下さい(例:こんにちは) 7. リストに情報が登録されていない場合は、サブグリーディング(代替挨拶文)が表示されます。注:初期設定ではGreetings!と入力されています。必要に応じて変更して下さい。(例:こんにちは) 8. 「挿入」ボタンをクリックします。 9. 「保存」ボタンをクリックして、変更内容をメールに保存します。 10. グリーティングのレイアウトを確認したい場合は、編集画面の右下の「プレビュー」ボタンをクリックしてください。 <グリーティングの内容を変更したい場合> 1. 挿入したグリーティング(赤い点線の枠内)をダブルクリック 2. ポップアップ画面が表示されますので、編集を行います。 カスタムHTMLでグリーティングを使用する場合 タグは以下の通りです。 [Greeting:pretext="Dear" field="F" alttext="Hello"] "pretext"がメッセージとして表示される箇所となります。 "field"は表示するコンタクト情報を指定する箇所です。 "F" = 名 "L" = 姓 "FL" = 名 + 姓 alttextはコンタクト情報が登録されていない方への代替文となります。 トップに戻る     リンクURLにパーソナライズ情報を追加する方法 登録したIDや会員番号を、URLの後ろに追加することが可能です。 1. エクセルファイル上で各読者に固有のIDを割り振る。(例:I列に個々のIDを入力) 2. リストをエクセルファイルとしてアップロードする際、そのIDを任意のフィールド項目(例:「その他1」)にアップロードします。詳細は以下のスライド資料(PDF)P11,12をご覧ください: 顧客リストインポート 3. リスト内のフィールド項目にIDが登録される。(例:abcde@benchmarkemail.comの登録情報の「その他1」に「12345」というIDが登録される。) 4. リンクを設置する際、URLの後ろに[contact_attribute:フィールド名(例:その他1)]と記載する。 ※フィールド項目名は任意で構わないが、「その他1」の部分に該当する項目名を記入する。(例:ウェブサイトURLにhttps://www.benchmarkemail.com/jp=[contact_attribute:その他1]と記入) 5. メールを配信すると、受信者によってクリックした際のURLが変わる。(例:abcde@benchmarkemail.comが受信したメールで、パーソナライズ設定したリンクをクリックすると、https://www.benchmarkemail.com/jp=12345に遷移する) 6. メール配信に複数のリストを使用する際は、必ずIDをアップロードするフィールドを統一し、フィールド名を編集する際はどのリストも同じ名前にするようにしてください。 トップに戻る     コンタクトを指定してプレビューを表示する方法 1. パーソナライズタグを挿入したメールを作成します。 2. 編集画面下の「テスト」ボタンをクリックし、「コンタクトを指定して表示」を選択します。 3. 配信リスト内から任意のメールアドレスをひとつ入力し「プレビュー」をクリックします。 4. (3)で入力したメールアドレスに登録された情報が表示されます。(ただし件名に挿入したパーソナライズタグは確認することができません。) 注意:通常のプレビューでは、パーソナライズ情報はリスト内にあるコンタクトを無作為に選択されて表示されるようになっております。 トップに戻る     受信メールの宛先欄に「様」などの敬称を表示させる方法 残念ながら受信メールの宛先欄に敬称を表示させる機能はございません。 しかし、コンタクトリストに「姓」または「名」部分が登録されている場合、受信メールの宛先欄に反映され、受信者の名前として表示される為、「姓」または「名」部分を利用し、敬称を登録する事で表示が可能になります。 例1:「姓」部分に「田中花子」と入力し、「名」の部分に「様」と入力 例2:「姓」部分に「田中様」と入力し、「名」の部分は空白 また、「姓」「名」ともに空白の場合、宛先欄にはアドレスのみが表示されます。   コンタクトリストの項目設定や編集方法は以下のFAQをご覧ください。 FAQ:コンタクトリストの情報を更新・編集する方法は? リストアップロードにおけるトラブルシューティングは以下のFAQをご覧ください。 FAQ:リストアップロードにおけるトラブルシューティング トップに戻る   ご不明な点がございましたらこちらよりサポートへご連絡下さいませ。     >>「メール作成:編集操作」のまとめページに戻る

ドラッグ&ドロップエディタ 12月 27, 2021

メール内のブロックを移動・コピー・削除する方法

メール内のブロックを移動・コピー・削除する方法は以下の通りです。また、お気に入りブロック機能を使って、ブロックを保存し、他のメールで保存したブロックを使用することも可能です。 メール内のブロックを移動・コピー・削除する方法 1. 編集画面で、対象のブロックにカーソルを当てます。 2. ブロック右上にアイコンが3種類表示されます。 移動:十字ボタンをクリックしたまま、移動したい位置までドラッグします。 コピー:中央のボタンをクリックします。 削除:右端のゴミ箱ボタンをクリックします。 お気に入りブロック機能について また、有料プランをご利用の方は「お気に入りブロック」を使って、作成したブロックを簡単に保存し、再利用することができます。詳しい使い方については、以下のFAQをご覧ください。 FAQ:メールのセクション機能と各ブロックの説明 サイズを変更する方法 1. HTMLコードを表示させます。 2. 最初の段に記述されている「Width="100%"」というコードを確認してください。 3. "100%"の値の変更がブロックの幅へと反映されます。 またPx単位で大きさを指定することも可能です。この場合、上限が600Ppxとなります。 4. 「保存&閉じる」をクリックし、ブロックの「保存」をクリックし変更を保存してください。 注意:600px以上の数値を入力しないでください。 ドラッグアンドドロップエディタでHTMLコードを編集する方法は、以下のFAQをご参照ください。 FAQ:どのようにHTMLコードを表示しますか?     >>「メール作成:編集操作」のまとめページに戻る

General Questions 3月 15, 2022

自分でデザインしたHTMLメールを送れますか?

はい、送れます。Benchmark Emailではドラッグ&ドロップ、テキスト版、HTMLコードの3種類のエディターをご用意しております。メールを作成する際にHTMLコードエディターを選択することで、ご自身でデザインされたHTMLコードを簡単に挿入することができます。 以下の手順は、すでにご自身のHTMLメールテンプレートを作成されていることを前提としております。使用したすべての画像がURLとして参照されることをご確認ください。 自分でデザインしたHTMLメールを作成する方法 1. アカウントにログインし、左のダッシュボードメニューよりメール>メールを選択します。 2. 右上の「メール作成」ボタンをクリックし、通常メール配信を選択し、「次へ」ボタンをクリックします。 3. エディター選択ページでHTMLコードを選択し、「次へ」ボタンをクリックします。 4. メール名を入力します。こちらは管理用で購読者には表示されません。 5. メール名を入力後はメール編集画面に遷移します。すぐHTMLコードのエディターでメールを作成することができます。 6. 画面左に表示される Email Content と記載された箇所に、作成したコードを入力します。HTMLコードにすでにボディやHTMLタグを使用している場合は、エディターからタグを削除してください。 7. 右側の画面でリアルタイムにデザインを確認することが可能です。 8. HTMLコードの編集が全て完了しましたら、画面右下の「保存」または「保存&次へ」ボタンをクリックします。 「保存」ボタンをクリックすると、メールが保存され、後で編集をすることができます。 「保存&次へ」ボタンをクリックすると、メールチェックリストのページに遷移します。各項目を入力する際は、次の項目に移動する前に必ず「保存」をクリックしてください。 メール名を入力後はすぐにメール編集画面に遷移します。チェックリストの画面から再度編集ページに移動するには、チェックリストの本文&デザインから「メール編集」ボタンをクリックしてください。   HTMLコードのツールバーについて テーマスタイル:一番左のドロップダウンメニューよりコードエディターのテーマスタイルを変更することができます。 挿入機能:グリーティング(挨拶文)やパーソナライズタグを挿入することができます。コンタクト詳細タグを使用する前に、必ずコンタクトリストにフィールド項目が追加されているかご確認ください。 テキストメール:HTMLメール内の全てのテキストが表示されます。ここで“X”と表示されている場合は、テキスト版とHTML版が同期化されていないことを意味します。同期化していないとメールの配信または配信予定の設定を行うことはできません。同期化するには以下の手順に従ってください。 「テキストメール」ボタンをクリック 「HTML版とテキスト版の内容を同期」ボタンをクリック ポップアップ画面で変更内容を確認し、「次へ」ボタンをクリック 左の「HTMLメール」ボタンをクリック これでメールの配信設定および配信をすることができます。 画像ギャラリー: 既存の画像を挿入または新しい画像をアップロードします。画像を選択した際、URLがメールのコードに挿入されます。必ず適切な画像タグ(例:<img>)を追加してください。 コード閲覧:初期設定では、左にコード編集、右にHTMLメールの表示と分割表示になっています。コードを編集しながらどのようにメールで表示されるかを確認することができます。分割表示を解除しコード編集画面のみ表示させたい場合に、こちらのアイコンをクリックしてください。   設定オプションについて 画面左下にある「設定」ボタンをクリックします。フッタータブをクリックし、使用したい実際の事業所・オフィス所在地を変更したり、購読リンクを選択することができます。 コンテンツタブでは、パーミッションリマインダーやウェブページ表示のリンクを追加・削除することが可能です。(パーミッションリマインダーを追加するとGDPRに遵守したメールとなります。) その他のオプションについて 右下に表示されるプレビューオプションをクリックすると、配信する前にメールがどのように表示されるかご確認いただけます。 また、テストのドロップダウンメニューは「テストメールの送信」「スパムチェック」「印刷プレビュー」「コンタクトを指定して表示」などがあり、「受信テスター」ではさまざまな受信箱でメールがどのように表示されるかをテストすることができます。 メールを配信する前に、受信者側でメールがどのように見えるかを確認する方法やテストメールの送り方に関しては、以下のFAQをご参照ください。 FAQ:送信前にメールを確認したいのですが、どのような方法がありますか? FAQ:テストメールの送り方について また、配信予定のメールが各メーラー(メールサービス)の受信箱でどのように表示されるかを確認したい場合は、受信テスター(有料)をご利用ください。詳しくは以下のFAQをご覧ください。 FAQ:受信テスターの目的と作成方法について 重要:コード編集画面内でコードを検索したい場合は、ショートカットキーをご利用ください。(Windows: Cmdキー+ F / Mac: Ctrlキー+F)   注意点: *画像やリンクなどを指定する時は、絶対パスを使用してください。 ・絶対パスとは、URLでページを指定して、目的地(情報)がどこにあるのかを伝えます。リンク先のURLをhttp://〜省略することなく全て記述する方法です。以下のような絶対パスの指定方法であることを確認してください。 <a href="http://www.mysite.com/myfolder/index.htm">Click here for more info</a> ・相対パスとは、今いる場所(階層)を基準にして、目的地(情報)がどこにあるのかを伝えます。リンク先のURLを現在地から目的の位置までの道筋にある要素を順に並べて記述する方法です。画像やリンクなどを指定する際は、相対パスは使用しないでください。 <a href="myfolder/index.htm">Click here for more info</a> *Div/Layerを用いての位置調整は、ほとんどのメーラーで非対応となっているためBenchmark Emailでは推奨しておりません。 以下のようなコーディングは無効になりますので、ご注意ください。 <div style="position:absolute; left:10px; top:10px; float:left;"> Hello </div> 画像や文字の配置を調整するにはテーブルタグをご利用ください。   トップに戻る   ご不明な点がございましたら、サポートまでお知らせください。     >>「メール作成:編集操作」のまとめページに戻る

メール配信機能 1月 12, 2022

イメージマップ(クリッカブルマップ)をメールに挿入する方法

イメージマップとはクリック可能な領域のことで、一枚の画像上に複数のURLを設定することができます。 ドラッグ&ドロップやHTMLコードエディタでイメージマップを簡単に挿入することが可能です。 始める前に: Benchmark Emailではイメージマップの挿入についてはサポート対象外となりますので、お問い合わせにはご返答できません。 イメージマップの破損を防ぐため、挿入する前には必ずコードが正常に作動するか確認してください。 コーディングに慣れていない方は、専門家や外部のサービスに相談してイメージマップを作成することをお勧めします。 文章と画像の比率を十分に考慮し、文章は画像に埋め込まずに、メールの本文に直接入力してください。画像が多すぎるメールは迷惑メールフィルターにかけられる恐れがあります。 メール1件につき、イメージマップは1つに限定してください。 メールをレスポンシブ対応にしてイメージマップの破損を防ぐには、幅は640px以下にしてください。 イメージマップコードを挿入するには以下の手順に従ってください: HTMLコードエディタを使ってイメージマップを挿入する方法 HTMLコードエディタでイメージマップコードを追加するには、任意の場所にコードをコピーし貼り付けます。 ドラッグ&ドロップエディタを使ってイメージマップを挿入する方法 1. テキストブロックをドラッグ、または既存のテキストブロックをクリックします。 2. 初期設定で挿入されているテキストを削除し、右上に表示されるツールバーでHTMLコード確認アイコンをクリックします。 3. ポップアップで表示されるボックス内に、イメージマップコードを貼り付けます。 4. 右下の「保存&閉じる」ボタンをクリックします。これでメールへのイメージマップの挿入が完了です。 なお、メールを本配信する前に必ずプレビューで確認したり、テストメールを送信したりすることをお勧めします。 ご不明な点がございましたら、サポートまでご連絡ください。     >>「メール作成:編集操作」のまとめページに戻る

ドラッグ&ドロップエディタ 1月 31, 2022