利用開始までの大まかな流れ

ポップアップの利用を開始するための大まかな流れは以下のようになります。
各操作方法の詳細は次項からご説明致します。

フォームタイプのポップアップの場合

①フォームを作成する
②フォームを公開する
③ポップアップを新規作成する
④ポップアップを設定する
⑤ポップアップを表示させたいWebページに共通タグを埋め込む
⑥ポップアップを公開する

画像タイプのポップアップの場合

①ポップアップを新規作成する
②ポップアップを設定する (画像のアップロードもここで行う)
③ポップアップを表示させたいWebページに共通タグを埋め込む
④ポップアップを公開する

該当メニュー

画面上部メニューより「ポップアップ」ボタンをクリックするとポップアップ一覧画面に遷移します。

※「ポップアップ」メニューはログインユーザ権限の「管理者ユーザ」のみ表示されます。「一般ユーザ」にはメニュー自体が表示されません。

ポップアップ一覧画面では、以下が行えます。
・現在作成されているポップアップの情報一覧表示
・ポップアップを新規作成する画面への遷移
・ポップアップ詳細画面への遷移
・非公開となっているポップアップの削除

フォームタイプのポップアップ作成~公開

★事前に「フォーム機能」でポップアップ表示するフォームを作成してください。


（1）画面上部「ポップアップ」メニューをクリック

（2）「＋新規登録」ボタンをクリック

フォーム機能のメニューからも作成できます。
フォーム＞フォーム名選択＞ポップアップ設定タブ＞「＋新規登録」ボタン

（3）「表示する内容」で「フォーム」を選択します。

（4）各項目を入力し、画面下の「保存」ボタンで設定を保存

全体像

　

■ポップアップ名

ポップアップ名を入力します。他のポップアップとは重複できません。

■タイトル

ポップアップの最上部に表示する、ポップアップのタイトルを入力します。
入力必須ではありません。

■タイトルの文字色

ポップアップの最上部に表示する、ポップアップのタイトルの文字色を指定します。
入力必須ではありませんが、タイトルが入力されている場合は入力必須です。

■バーの背景色

ポップアップ最上部のバーの色を指定します。

■閉じるボタン

■「表示する」にチェックが入っていない場合
ポップアップの最大表示時、- ボタンのみが表示されます。

■「表示する」にチェックが入っている場合
ポップアップの最大表示時、- ボタンの隣に x ボタンが表示されます。

また、設定画面において、ポップアップを閉じた後の挙動を選択するラジオボタンが表示されます。

■「以後表示しない」を選択した場合
x ボタンをクリックすると、それ以降ポップアップが表示されなくなります。

※ただし、ポップアップが表示されなくなっても、Webページ表示数はカウントされ続けます。

※以下のような特定の状況下では、再表示されることがあります。
・エンドユーザがプライベートブラウザを使用している
・エンドユーザがSafariを使用している
・エンドユーザのPCの容量がいっぱいになっている

■「再度アクセスしたときに表示する」を選択した場合
x ボタンをクリックするとポップアップが消えますが、
再度そのWebページにアクセスがあった場合はポップアップが表示されます。

■表示するフォーム

「選択」ボタンをクリックすると、フォームを選択するためのダイアログが開きます。

公開中のフォームのみが一覧で表示されます。

なお、フォーム＞フォーム名選択＞ポップアップ設定タブ＞「＋新規登録」ボタンからの作成した場合、すでにそのフォームが選択されている状態になっています。

■表示する高さについて

ポップアップの縦の長さを設定します。
初期値は 650px です。
設定された高さでフォームが収まらない場合は、スクロールバーが表示されます。

横の長さは355px固定です。

■表示する位置について

Webページ上にポップアップを表示する位置を指定できます。

■PC

左図：「右下」を選択した場合　右図：「中央」を選択した場合

※オーバーレイ部分(背景の黒い部分)をクリックすると、
　x ボタンをクリックしたときと同じ挙動になります

※最小化状態のときは、どちらを選択しても右下に表示されます

■スマホ

※「右下」を選択しても中央に表示されます
※最小化状態のときは、どちらを選択しても中央に表示されます

■表示するタイミングについて

Webページ上で、ポップアップをいつ表示させるかを指定できます。

〇「即時」を選択した場合
Webページを開くとすぐにポップアップが表示されます。

〇「スクロール量」を選択した場合
Webページを指定した割合までスクロールすると、ポップアップが表示されます。
また、設定画面において、割合を指定するテキストボックスが表示されます。
初期値は 30% です。

〇「時間」を選択した場合
Webページを開いて指定した秒数が経過すると、ポップアップが表示されます。
また、設定画面において、時間を指定するテキストボックスが表示されます。
初期値は 3秒後 です。

■表示／除外のURLについて

ポップアップを表示させたいWebページのURLと、表示させないWebページのURLをそれぞれ複数個指定できます。

「表示するWebページのURL」のみ、1つ以上指定する必要があります。
表示URL・除外URLの合計で20個まで指定できます。


「+ 除外するWebページのURLを追加」ボタンをクリックすると、
除外URLの入力欄が表示されます。

なお、「表示するWebページのURL」と「除外するWebページのURL」に、
“同じURL かつ 同じ条件”のものを入力すると、エラーになります。


（5）ポップアップを表示させたいWebページに共通タグを埋め込む
　⇒こちらを参照
　
ポップアップをWebページ上に表示させるためには、共通タグをそのWebページに埋め込む必要があります。

※【重要】2024年5月22日以前に配配メール画面から取得した「共通タグ」ではポップアップ機能をご利用いただけません。
各種設定＞タグ設定＞「共通タグ」タブより、新しい共通タグの取得をお願い致します。

　

（6）ポップアップを公開

画面上部「ポップアップ」メニューを選択し、ポップアップ一覧画面から(4)で付けたポップアップ名を選択します。
　
ポップアップ詳細画面の「状態」項目のカルーセルをONに切り替え、公開します。

画像タイプのポップアップ作成～公開

（1）画面上部「ポップアップ」メニューをクリック

（2）「＋新規登録」ボタンをクリック

（3）「表示する内容」で「画像」を選択します。

（4）各項目を入力し、画面下の「保存」ボタンで設定を保存

全体像

■アップロードできる画像の条件

拡張子は「GIF・JPG・JPEG・PNG」のみ
ファイルサイズは3MBまで


※補足事項※

・アップロードする画像は、横幅が380pxの画像にすると、もっとも見た目の劣化が少なくなります。（アプリケーションが画像を横幅380pxに自動的にリサイズするため）

・画像の横幅を380pxに調整した後、縦幅が650pxを超える場合に上下がカットされます。そのため、縦長の画像をアップロードするとカットされる場合があります。

■ポップアップ名について

ポップアップ名を入力します。他のポップアップとは重複できません。

■タイトルについて

最小表示時のポップアップに表示する、ポップアップのタイトルを入力します。
入力必須ではありません。

※画像タイプのポップアップは、最小表示の時のみバーが表示されます

■タイトルの文字色について

最小表示時のポップアップに表示する、ポップアップのタイトルの文字色を指定します。

入力必須ではありませんが、タイトルが入力されている場合は入力必須です。

■バーの背景色について

最小表示時のポップアップのバーの色を指定します。
※画像タイプのポップアップは、最小表示の時のみバーが表示されます

■閉じるボタンの挙動について

■「最小化して表示する」を選択した場合
フォームタイプのポップアップとは違い、- ボタンが表示されません。
x ボタンをクリックしたときに最小化されます。

■「以後表示しない」を選択した場合
x ボタンをクリックすると、それ以降ポップアップが表示されなくなります。
ただし、ポップアップが表示されなくなっても、Webページ表示数はカウントされ続けます。

■「再度アクセスしたときに表示する」を選択した場合
x ボタンをクリックするとポップアップが消えますが、
再度そのWebページにアクセスがあった場合はポップアップが表示されます。

※「以後表示しない」もしくは「再度アクセスしたときに表示する」を選択しているとき、最小表示のプレビュー欄が非表示になります

■表示する位置について

Webページ上にポップアップを表示する位置を指定できます。

■PC

左図：「右下」を選択した場合　右図：「中央」を選択した場合

※オーバーレイ部分(背景の黒い部分)をクリックすると、
　x ボタンをクリックしたときと同じ挙動になります

※最小化状態のときは、どちらを選択しても右下に表示されます

■スマホ

※「右下」を選択しても中央に表示されます
※最小化状態のときは、どちらを選択しても中央に表示されます

■表示するタイミングについて

Webページ上で、ポップアップをいつ表示させるかを指定できます。

〇「即時」を選択した場合
Webページを開くとすぐにポップアップが表示されます。

〇「スクロール量」を選択した場合
Webページを指定した割合までスクロールすると、ポップアップが表示されます。
また、設定画面において、割合を指定するテキストボックスが表示されます。
初期値は 30% です。

〇「時間」を選択した場合
Webページを開いて指定した秒数が経過すると、ポップアップが表示されます。
また、設定画面において、時間を指定するテキストボックスが表示されます。
初期値は 3秒後 です。

■表示／除外のURLについて

ポップアップを表示させたいWebページのURLと、表示させないWebページのURLをそれぞれ複数個指定できます。

「表示するWebページのURL」のみ、1つ以上指定する必要があります。
表示URL・除外URLの合計で20個まで指定できます。


「+ 除外するWebページのURLを追加」ボタンをクリックすると、
除外URLの入力欄が表示されます。

なお、「表示するWebページのURL」と「除外するWebページのURL」に、
“同じURL かつ 同じ条件”のものを入力すると、エラーになります。

■移動先URLについて

ポップアップをクリックしたときに遷移させたいWebページのURLを設定します。

なお、「表示するWebページのURL」と「除外するWebページのURL」に、
“同じURL かつ 同じ条件”のものを入力すると、エラーになります。


（5）ポップアップを表示させたいWebページに共通タグを埋め込む
　⇒こちらを参照
　
ポップアップをWebページ上に表示させるためには、共通タグをそのWebページに埋め込む必要があります。

※【重要】2024年5月22日以前に配配メール画面から取得した「共通タグ」ではポップアップ機能をご利用いただけません。
各種設定＞タグ設定＞「共通タグ」タブより、新しい共通タグの取得をお願い致します。

　

（6）ポップアップを公開

画面上部「ポップアップ」メニューを選択し、ポップアップ一覧画面から(4)で付けたポップアップ名を選択します。
　
ポップアップ詳細画面の「状態」項目のカルーセルをONに切り替え、公開します。

ポップアップの公開／非公開

画面上部「ポップアップ」メニューを選択し、ポップアップ一覧画面からポップアップ名を選択します。

ポップアップ詳細画面の「状態」項目のカルーセルを切り替え、公開/非公開にします。
※初期値は非公開

非公開→公開 についての注意点

■フォームタイプの場合の注意点
・紐づいているフォームが非公開の場合、ポップアップを公開することはできません。
・フォームの紐づけが解除されている場合、ポップアップを公開することはできません。

■ポップアップをWebページ上に表示させるためには、共通タグをそのWebページに埋め込む必要があります。

※【重要】2024年5月22日以前に配配メール画面から取得した「共通タグ」ではポップアップ機能をご利用いただけません。
各種設定＞タグ設定＞「共通タグ」タブより、新しい共通タグの取得をお願い致します。

フォームの非公開、削除について

フォームを非公開にする、もしくは削除したい場合、
そのフォームに紐づけられたポップアップがすべて非公開状態である必要があります。

公開状態のポップアップが一つでも紐づけられている場合、ダイアログが表示されます。


そのフォームに紐づけられたポップアップの一覧は、フォーム＞フォーム名を選択＞フォーム詳細画面の「ポップアップ設定」タブで確認することができます。

登録済みポップアップの詳細閲覧

ポップアップ ＞ ポップアップ一覧 ＞ ポップアップ名をクリック

ポップアップ詳細画面では、以下が行えます。

・ポップアップの公開／非公開の切り替え
・ポップアップ編集画面への遷移
・ポップアップのプレビュー表示
・Webページ表示数、ポップアップ表示数、リアクション数、反応率の表示
・表示する内容の情報の表示

◎フォームタイプの場合
・表示するフォームのフォーム詳細画面への遷移

◎画像タイプの場合
・表示する画像ファイル名の表示
・移動先URLの表示

公開中のポップアップの編集

公開中のポップアップの内容を編集しても内容は即座に反映されません。

公開中のポップアップを編集した場合、ポップアップ詳細画面に以下のメッセージが表示されます。

「ポップアップを更新」ボタンをクリックすると、公開しているポップアップへ編集内容が反映されます。
また、黄色枠内のメッセージが消えます。

更新時の注意点

・フォームタイプの場合で、紐づいているフォームが非公開の場合、ポップアップを更新することはできません。

・フォームタイプの場合で、フォームの紐づけが解除されている場合、ポップアップを更新することはできません。

レポート

ポップアップについて、以下の4つのデータを集計します。
・Webページ表示数
・ポップアップ表示数
・リアクション数
・反応率

これらの数値は、ポップアップ詳細画面の「レポート」部分で確認できます。

各数値は、5分毎に集計されます。

各数値は、複数のWebページに同じポップアップを表示させる場合、それぞれ合算します。

※フォームタイプのポップアップに回答があった場合、フォームの回答数とポップアップのリアクション数の両方に加算されます。

計測データがリセットされるタイミングと表示ダイアログ

①(強制) フォームタイプで、フォームの紐づけが解除されるとき

②(強制) フォームタイプで、紐づいているフォームが削除されるとき

③(任意) 公開中のポップアップを編集し、公開中のポップアップのデータを更新するとき
④(任意) 非公開のポップアップを編集したとき
⑤(任意) 公開中のポップアップを編集し、データを更新せず非公開に切り替えたとき

※③④⑤の編集は、以下のどれかの変更を行ったときのみが該当します。
・フォームタイプと画像タイプを切り替えたとき
・画像タイプで、表示する画像を変更したとき
・フォームタイプで、表示するフォームを変更したとき

注意事項

■公開ポップアップのレポート反映タイミング

ポップアップ一覧画面およびポップアップ詳細画面に表示される
「Webページ表示数」「ポップアップ表示数」「リアクション数」「最終反応日時」は、5分毎に集計されます。

※ただし、フォームタイプの場合のみ、リアクション数と最終反応日時が回答と同時に集計され、すぐに反映されます。

※フォームタイプのポップアップでアクセスや登録の多いものでは、集計反映タイムラグの間に一時的に反応率が100％を超える可能性があります。

■複数のポップアップを重ねて表示する場合

同じWebページに、同じ位置 かつ 同じタイミングで複数のポップアップを表示するように設定することは可能です。

この場合、ポップアップの作成日が新しいものが上になるように重ねて表示されます。
(本来推奨しない設定のため、動作は保証いたしません。)

■Webページに表示するポップアップの表示設定が無い状態の保持

ポップアップの表示設定が無い状態である場合、エンドユーザがポップアップ埋め込みページにアクセスしても、ポップアップは表示されません。

ポップアップの設定はそのエンドユーザのブラウザに1分間保持されるため、
ポップアップの設定を更新しても1分間は変更内容が適応されない（つまり、ポップアップが表示されない）状態になります。
1分後にそのエンドユーザがWebページを再表示することで、ポップアップが表示されます。

■ポップアップがWebページ上で最前面に表示されないケース

ポップアップはWebページの最前面に表示されるよう設計されていますが、まれに他の要素によって隠れてしまう場合があります。

これは、お客様の設定によって、ポップアップよりも高い優先順位を持つ要素が存在するためです。

以下のどちらかに当てはまる要素は、ポップアップよりも前面に表示されます。

– bodyの子要素にz-index:1000000が設定されている
– bodyの子要素でz-indexが設定されていない かつ bodyの孫要素に当たる対象の要素にz-index:1000000以上が設定されている

※bodyの子要素にz-indexが999999より小さい値が設定されている場合は、bodyの孫要素に1000000以上が設定されても問題ない

もしこの現象が発生した場合、ポップアップ機能の制約としてお客様側で調整をお願いいたします。

■GoogleTagManagerの使用

Google Tag Manager(GTM)でポップアップを表示するための共通タグを埋め込む場合、「document.writeをサポートする」という設定をONにする必要があります。

※GTMのご設定方法はサポート外です。

■ポップアップの表示をスクロール量で設定しているが即時表示されるケース

ポップアップの「表示するタイミング」を「スクロール量」で設定している場合、
Webページを指定した割合までスクロールすると、ポップアップが表示されます。

しかし、ポップアップを表示させるWebページが以下に該当する場合、
スクロール量によらずポップアップが表示されてしまうことがあります。

・画面のロード時間が長いWebページ
・ウィンドウサイズが動的に変わるWebページ

Webページが上記に該当する場合、「表示するタイミング」を「スクロール量」に設定していても、意図した位置てポップアップを表示させることは難しいため、
Webページそのものの表示方法を見直すか、ポップアップの「表示するタイミング」を「スクロール量」以外に変更することをご検討下さい。

　

ポップアップ画像テンプレート

ポップアップ画像について、ご活用シーン別のテンプレートをご用意しております。
以下からダウンロードしてご利用ください。