PageSenseでウェブプッシュ通知を送信するためのオプトイン設定の選択

お知らせ：当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。

適切なプッシュ通知は高い開封率が期待できますが、無関係な通知を過度に送信すると逆効果となり、ユーザーがアプリケーションの利用を停止する原因となります。PageSenseでは、訪問者がブラウザで通知を許可または拒否できるカスタマイズ可能なオプトインメッセージを作成することが可能です。ユーザーが通知の許可を選択すると、その情報が購読者リポジトリに保存され、Webサイトから今後のメッセージを受信し始めます。不要なアラートを送る前に、通知の価値を説明する最も簡単な方法の一つです。

PageSenseでプッシュ通知を開始する前に、「ユーザーにサブスクリプション管理を許可」オプションを有効にし、標準のオプトイン種類を選択していることを必ずご確認ください。このオプションを有効にしないと、ユーザーはWebサイトのプッシュ通知を管理・表示できません。

ユーザーが通知のオプトインまたはオプトアウトを選択できるようにする方法:
1. 右上のプロジェクト設定をクリックし、Web プッシュ通知を選択します。

2. ユーザーにサブスクリプション管理を許可のトグルを有効にし、オプトインタイプのいずれかを選択します。

ワンステップ・オプトイン（HTTPSのみ）:この方法では、ブラウザがネイティブのプロンプトを表示し、ユーザーに対してワンクリックでWebプッシュ通知のサブスクリプション管理を促します。訪問者は「許可」をクリックするだけでサブスクリプション管理が完了し、Webサイトからの通知受信が開始されます。

重要：この機能はHTTPSのWebサイト、またはSSL証明書を持つサイトでのみ動作します。

ネイティブブラウザプロンプトとは？
ネイティブブラウザプロンプトは、ブラウザの検索バーの左上に表示され、「許可」または「拒否」の設定が含まれます。WebサイトからのWebプッシュ通知について、ユーザーはこのプロンプト内の「許可」ボタンをクリックしてサブスクリプション管理を行います。

手順:

a.1. オプトイン表示箱の項目で、プロンプトを表示するタイミングを「一定時間後」または「ユーザーがWebサイトにアクセスした直後」から選択します。

a.2. Copyをクリックしてテキストボックス内のスクリプトをコピーし、Webサイトのルートディレクトリにあるサービス-worker.jsファイルに貼り付けてください。

Zoho Sitesを利用してWebサイトを作成している場合は、以下の手順でサービス-worker.jsファイルを簡単にサイトへ追加できます：
1. One-手順 opt-in（PageSense）からJSコードをコピーし、コンピュータのテキストエディタで'サービス-worker.js'という名前で保存します。
2. Zoho Sitesアカウントにログインし、opt-inを有効化したいWebサイトを選択します。
3. 画面上部の設定オプションをクリックし、Contentセクションに移動してFilesをクリックします。
4. 次に、アップロードをクリックし、コンピュータに保存したserver-worker.jsファイルを選択します。
5. 最後に、公開をクリックしてください。

下図のように、one手順 opt-inでは、ブラウザウィンドウの左上にWebサイトからの通知をBlockまたはAllowで設定できるネイティブブラウザプロンプトが表示されます。

2-手順 Opt-In: この方法では、最初に訪問者へカスタム通知プロンプトが表示され、ユーザーがWebプッシュ通知をサブスクリプション管理する理由を説明します。ユーザーがAllowをクリックすると、ブラウザがネイティブプロンプトを表示し、Webプッシュ通知のサブスクリプション管理を求めます。

重要：HTTP・HTTPS両方のWebサイトで動作します。

PageSenseでは、いずれかのWebプッシュopt-in方法を選択すると初期設定のバナーが表示されます。

初期設定のPageSenseバナーは以下のようになります：

選択したWebプッシュのオプトインには、ブラウザの同意ポップアップが表示されます。

プッシュ通知バナーに変更を加えたい場合は、2-手順オプトインで編集した後、希望するオプトインを有効にしてください。

手順:

b.1. Subdomainテキスト箱に、ユーザーのブラウザのプロンプトで表示するドメインの名前を入力してください。

メモ:サブドメイン名を追加することで、ユーザーは通知が自社サイトから送信されたことを認識できます。たとえば、サブドメイン名にZylkerfashionと入力した場合、ユーザーが「Allow」ボタンをクリックすると、下記のようにプロンプトのオプトインボックスにzylkerfashion.cdn.pagesense.ioが表示されます。

b.2. Display Opt-In 箱の項目で、プロンプトをユーザーがWebサイトにアクセスした直後に表示するか、または一定時間経過後に表示するかを指定してください。
3. 通知の初期設定アイコンとして使用するアイコンをアップロードしてください（通知作成時に変更可能です）。
b.4. 必須項目（通知件名、説明、許可／拒否ボタンのテキストなど）を入力してください。これらの通知がデスクトップやモバイルブラウザでどのように表示されるかは、右側のプレビューセクションで確認できます。

下図のように、ユーザーはまず画面上部中央にカスタム通知プロンプトが表示され、Webサイトからの通知表示を許可するか確認されます。ユーザーがプロンプト内のAllowボタンをクリックすると、子ウィンドウが表示されます。

b.5. Allow 通知オンモバイル ボタンを有効にすると、訪問者のモバイルブラウザに通知バナーが表示されます。
b.6. Child Window Setting ボタンを有効にすると、カスタマイズした通知メッセージをユーザーに追加でき、訪問者に通知のサブスクリプション管理を促すことができます。

Opt-in Text 項目で、訪問者にWebサイトからのプッシュ通知をサブスクリプション管理するよう促す件名テキストを入力します。例えば、「'Allow'をクリックして当社からの通知を受け取る」といったメッセージにすることができます。
Offer Text 項目で、オプトインの本文に表示されるテキストを入力します。例えば、「最新ニュースやお得な情報をお届けします。詳細はサブスクリプション管理でご確認ください！」といったメッセージが考えられます。

ユーザーがカスタム通知プロンプトでAllowボタンをクリックすると、入力したサブドメイン名が表示されたネイティブブラウザプロンプト付きの子ウィンドウがWebサイトページ上に表示され、そこで次の操作が可能です。

ユーザーは、ネイティブプロンプトのAllowボタンをクリックしてサブスクリプションを確定する必要があります。

ユーザーが箱プロンプトでAllowをクリックし、ネイティブブラウザプロンプトでDon't Allowをクリックした場合、サブスクリプションは完了しません。

c. カスタム Opt-In: この方法では、ユーザーがWebサイト上に配置されたボタンまたはリンクをクリックすると、opt-in箱が表示されます。ボタンやリンクテキストの名前、色、位置を必要に応じてカスタマイズできます。

手順:

c.1. Subdomainテキスト箱内に、ブラウザのネイティブプロンプトにユーザーへ表示されるドメイン名を入力してください。

メモ: サブドメイン名を追加することで、通知が実際に自社サイトから送信されたものであることをユーザーに知らせることができます。例えば、サブドメイン名として Zylkerfashion を追加した場合、ユーザーが「許可」ボタンをクリックすると、プロンプトのopt-in箱に zylkerfashion.cdn.pagesense.ioが下記のように表示されます。

c.2. コピー をクリックして、ボタンまたはリンクのコードをコピーし、ご自身のWebサイトのHTML内に貼り付けます。必要に応じて、CSSを用いてコードスニペットのスタイルをさらに調整できます。

下記のように、カスタムopt-inでは、ユーザーはまずWebサイト上の 通知を取得する ボタンを目にします。このボタンをクリックすると、画面の中央上部にカスタム通知プロンプトが表示され、Webサイトからの通知の表示許可を求められます。

ユーザーがプロンプト上の Allow ボタンをクリックすると、入力したサブドメイン名を含む子ウィンドウでネイティブブラウザプロンプトが表示され、そこから以下の操作に進みます。

ユーザーは、ネイティブプロンプト上の「許可」ボタンをクリックしてサブスクリプションを確定する必要があります。

ユーザーが箱プロンプトでは「許可」をクリックし、ネイティブブラウザプロンプトでは「許可しない」をクリックした場合、未購読のままとなります。