Webサイト設定

Webサイト設定

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

Zoho PageSenseの［Webサイト］セクションでは、PageSenseとWebサイトの接続や操作に関する設定を行えます。これには、トラッキング用コードスニペットのインストール、ブラウザー通知の有効化、訪問者が更新情報を受け取るための登録方法の管理が含まれます。

これらを設定することで、PageSenseは訪問者の行動の追跡、テストの実行、分析情報の収集、通知によるユーザーとの直接的なコミュニケーションを行えるようになります。

Webサイトの設定には通常、次のセクションがあります。

  • ［コードスニペット］– WebサイトにPageSenseのトラッキングコードをインストールし、検証します。
  • ［Webプッシュ通知］– 訪問者がWebサイトからのブラウザー通知を受け取るための登録を行えるようにします。

各セクションは、PageSenseによる訪問者の行動の追跡とユーザーエンゲージメントの向上において重要な役割を果たします。

コードスニペット

Zoho PageSenseのWebサイトの設定にある［コードスニペット］セクションでは、WebサイトにPageSenseのトラッキングコードをインストールして管理できます。このコードスニペットのインストールは、訪問者の行動データの収集やサイト上での最適化テストを開始するための、最初かつ最も重要な手順です。

コードスニペットをWebサイトに追加すると、PageSenseはクリック、スクロール、ページへの訪問、コンバージョンなど、訪問者の操作や行動指標の追跡を開始します。このデータは、PageSenseのA/Bテスト、スプリットURLテスト、パーソナライゼーション、ヒートマップ、ファネル、フォーム分析、目標などの機能で使用されます。

コードスニペットを正しくインストールすることで、PageSenseは訪問者を継続的に追跡し、正確な分析結果とテスト結果を提供できます。

Notesメモ：［設定］アイコンは、PageSenseの操作画面の右上にあります。プロジェクトのコードスニペットを表示するには、そこから［Webサイト］→［コードスニペット］に移動します。

コードスニペット

PageSenseで訪問者の指標の収集を開始するには、JavaScriptトラッキング用コードスニペットをWebサイトにインストールする必要があります。
Webページでのスクリプトの読み込み方法に応じて、3種類のコードスニペットから選択できます。
  • 同期コードスニペット
  • 非同期コードスニペット
  • スマートコードスニペット
それぞれの選択肢によって、PageSenseスクリプトの読み込み方法や、Webサイト上のその他のスクリプトとの連携方法が決まります。
同期コードスニペット
同期コードスニペットは、Webページ上のその他のスクリプトとともに順番に読み込まれます。そのため、ブラウザーはPageSenseスクリプトの読み込みが完了するまで、その他のスクリプトの処理を待機します。
同期コードスニペットを使用する場合：
  • Webサイトでスクリプトを厳密な順序で実行する必要がある場合
  • その他のスクリプトが実行される前にPageSenseを読み込む場合
  • PageSenseを最初に読み込む必要がある高度なカスタムスクリプトを実行している場合
ただし、同期スクリプトは読み込み中にその他のスクリプトを一時的にブロックするため、負荷の高いページで使用すると、ページのパフォーマンスにわずかな影響を与える可能性があります。
一般的な最新のWebサイトでは、代わりに非同期またはスマートコードによる実装をお勧めします。


非同期コードスニペット
非同期コードスニペットは、ページ上のその他のスクリプトをブロックせず、独立して読み込まれます。PageSenseスクリプトがバックグラウンドで読み込まれている間も、ブラウザーはその他の要素の読み込みを続けます。

非同期コードスニペットを使用する場合：
  • ページのパフォーマンスを向上させ、表示を高速化する場合
  • Webサイトに複数のサードパーティースクリプトが含まれている場合
  • ページ上のその他のスクリプトに影響を与えずにPageSenseを読み込む場合
非同期スクリプトはページの読み込みをブロックしないため、通常、ほとんどのWebサイトでは同期スクリプトよりも推奨されます。


スマートコードスニペット
スマートコードスニペットは、PageSenseを使用するほとんどのWebサイトに推奨される実装方法です。
スマートコードは、スクリプトの読み込み方法とWebサイトとの連携を自動的に最適化します。スクリプトの実行を適切に管理して、テスト中のちらつきを抑え、ページをより高速に表示します。


スマートコードの利点
  • スクリプトの読み込みを自動的に最適化
  • A/Bテストやパーソナライゼーションのテスト実行時のちらつきを軽減
  • ページの読み込みパフォーマンスを向上
  • ユーザーエクスペリエンスに影響を与えず、テストを円滑に実行
A/Bテスト、スプリットURLテスト、パーソナライゼーションキャンペーンを実行するWebサイトでは、スマートコードを使用することで、最も安定した最適なパフォーマンスを得られます。


コードスニペットをインストールすると、PageSenseはCookieを使用して訪問者の操作の追跡を開始します。これらのCookieは、再訪問者を識別し、テストや分析でセッションの継続性を維持するために使用されます。


透明性を確保し、プライバシー規制に準拠するため、Cookieの使用について訪問者に通知するCookie同意バナーをWebサイトに表示することをお勧めします。

Cookieへの同意とプライバシーを設定するには、コンテンツとプライバシーの設定のヘルプ記事を参照してください。

Google タグ マネージャーとの連携

Webサイトでスクリプトの管理にGoogle タグ マネージャー（GTM）を使用している場合は、コードをWebサイトに直接追加する代わりに、GTMを使用してPageSenseのコードスニペットをインストールできます。


タグ マネージャーを使用したコードスニペットの設定手順については、PageSenseのGTM連携ガイドを参照してください。

コードスニペットのインストール

PageSenseのコードスニペットを手動でインストールするには、次の手順を実行します。

  1. PageSenseの［コードスニペット］セクションからコードスニペットをコピーします。
  2. Webサイトのページにある<head>タグ内にコードスニペットを貼り付けます。
  3. Webサイトへの変更を保存して公開します。
インストールが完了すると、PageSenseは訪問者の操作を追跡し、分析やテストに使用するデータの収集を開始します。

インストールの確認

コードスニペットをインストールした後、［インストールの確認］オプションを使用して、PageSenseがWebサイトに正しく接続されていることを確認できます。

WebサイトのURLを入力し、ページでコードスニペットが正常に検出されるか確認します。

例：https://zylkerautomation.zohoecommerce.com/

Webプッシュ通知

Zoho PageSenseのWebプッシュ通知セクションでは、ブラウザー通知を有効にし、訪問者がWebサイトから直接登録して最新情報を受け取れるようにできます。これらの通知により、訪問者がWebサイトを閲覧していないときでも、新しいコンテンツ、特典、商品の更新、お知らせなどを送信して、訪問者に再び働きかけることができます。

通知を受信するには、訪問者がWebサイトに表示されるサブスクリプションの確認画面で許可する必要があります。PageSenseには、サブスクリプションの確認画面を表示する方法やタイミングを管理できる、複数の同意確認（オプトイン）方法が用意されています。
Notesメモ：［設定］アイコンは、PageSenseの操作画面の右上にあります。通知サブスクリプションの設定を行うには、［Webサイト］→［Webプッシュ通知］に移動します。

ユーザーによる登録の許可

登録者の収集を開始するには、まず、訪問者がWebサイトからの通知に登録できる選択肢を有効にする必要があります。有効にすると、PageSenseにより、通知を許可するよう訪問者に求めるサブスクリプションの確認画面が表示されます。

登録した訪問者は、PageSenseのキャンペーンから送信されたブラウザー通知を受信できます。

同意確認（オプトイン）の種類

PageSenseでは、登録者から許可を得るために複数の同意確認（オプトイン）方法を利用できます。方法ごとに異なるユーザーエクスペリエンスが提供されるため、通知の要求をどのように表示するかに応じて選択できます。

1段階の同意確認（オプトイン）

1段階の同意確認（オプトイン）では、ブラウザー標準の通知許可の確認画面が訪問者に直接表示されます。ユーザーがWebサイトにアクセスすると、通知を許可するかどうかをブラウザーが確認します。


この選択肢では、ブラウザーの許可ダイアログを使用して、訪問者がすばやく登録できます。

1段階の同意確認（オプトイン）を使用するタイミング

この方法は、次の場合に適しています。

  • 訪問者からWebサイトへの信頼がすでに高い場合
  • すばやく簡単な登録手続きを提供する場合
  • WebサイトでHTTPSを使用している場合

許可の確認画面を表示するタイミングは、訪問者がページにアクセスした直後や、数秒後などに設定できます。

サービスワーカーの要件

プッシュ通知を有効にするには、Webサイトのルートディレクトリーにサービスワーカーファイルが必要です。

ファイルが存在しない場合は、次の名前でファイルを作成します。


                         

                          

                           service-worker.js

このファイルをWebサイトのルートディレクトリーに配置し、一般公開されていることを確認してください。このファイルにより、ユーザーがサイトを閲覧していないときでも、ブラウザーから通知を配信できます。
2段階の同意確認（オプトイン）
2段階の同意確認（オプトイン）では、ブラウザーの通知許可の確認画面を表示する前に、Webサイト上にカスタムメッセージまたは同意確認（オプトイン）ボックスが表示されます。
訪問者には、通知の許可を求める理由を説明するメッセージが最初に表示されます。［許可］ボタンをクリックすると、ブラウザー標準の許可要求が表示されます。


2段階の同意確認（オプトイン）を使用する理由
2段階の同意確認（オプトイン）は、次の理由から推奨されます。
  • ユーザーからの信頼と透明性が向上する
  • 登録率が向上する
  • 最新のブラウザー通知ポリシーとの適合性が高い
Webサイトのブランドに合わせて、同意確認（オプトイン）メッセージの複数の要素をカスタマイズできます。

同意確認（オプトイン）メッセージのカスタマイズ
次の要素を設定できます。

  1. ［同意確認（オプトイン）の表示タイミング］
    訪問者がWebサイトにアクセスした後や、数秒後など、サブスクリプションのメッセージを表示するタイミングを選択します。
  2. ［画像］
    メッセージを視覚的に補足する小さな画像やアイコンを追加します。JPG、JPEG、PNG形式に対応しています。
  3. ［タイトル］
    通知の要求について説明する、サブスクリプションの確認画面に表示される見出しです。
  4. ［メッセージ］
    受信する通知の種類を訪問者に伝える短い説明です。
  5. ［ボタンのラベル］
    ［許可する］ボタンと［許可しない］ボタンのテキストをカスタマイズします。

子ウィンドウの設定

子ウィンドウ設定では、ブラウザー内に開くサブウィンドウに同意確認（オプトイン）の確認画面が表示されます。このウィンドウはメインページの延長として動作し、利用可能なすべてのボタンと設定項目に対応しています。


子ウィンドウを使用すると、閲覧エクスペリエンスを妨げることなく、通知の要求をより整理された目立つ形式で表示できます。

プレビュー

独自の同意確認（オプトイン）のトリガーを設定した後、PageSenseで通知サブスクリプションの確認画面が訪問者にどのように表示されるかをプレビューすることもできます。


Webとモバイルのプレビューモードを切り替えて、同意確認（オプトイン）のボタンやリンクが各デバイスでどのように動作するかを確認できます。これにより、Webサイトで公開する前に、サブスクリプションの確認画面が正しく表示され、デスクトップとモバイルの両方のユーザーに一貫したエクスペリエンスを提供できることを確認できます。
独自の同意確認（オプトイン）

独自の同意確認（オプトイン）では、通知サブスクリプションの確認画面を自動的に表示するのではなく、訪問者の特定の行動をきっかけに表示できます。


この方法は、訪問者がWebサイトを操作した後にのみ通知の許可を求める場合に便利です。

独自の同意確認（オプトイン）の一般的な使用例

  • ユーザーが［登録］ボタンをクリックした後に確認画面を表示する

  • フォームの送信完了後に確認画面を表示する

  • 特定のランディングページに確認画面を表示する

  • 訪問者がサイトを一定時間利用した後に通知の許可を求める

独自の同意確認（オプトイン）では、通知の要求を表示するタイミングや方法をより細かく管理できます。


ボタンによるサブスクリプションの開始

Webサイトにカスタムボタンを追加して、通知の確認画面を表示できます。

例：


                         

                          

                          

                           

                            

                             

                              

                              
    
                              
  1. <button onclick='window.pagesense=window.pagesense||[]; window.pagesense.push(['optInForPushNotification']);'>
    2. 
                              
  2. GET NOTIFICATIONS
    3. 
                              
  3. </button>
    4.

訪問者がこのボタンをクリックすると、ブラウザーにサブスクリプションの確認画面が表示されます。

リンクによるサブスクリプションの開始

リンクを使用してサブスクリプションの要求を開始することもできます。

例：


                         

                          

                          

                           

                            

                             

                              

                              
    
                              
  1. <a onclick='window.pagesense=window.pagesense||[]; window.pagesense.push(['optInForPushNotification'])'>
    2. 
                              
  2. GET NOTIFICATIONS
    3. 
                              
  3. </a>
    4.

これにより、通知サブスクリプションの要求を、Webサイト上のリンク、メニュー、その他の操作可能な要素に組み込むことができます。
 


このドキュメントは、すべての手順をご案内できるように作成されています。さらにサポートが必要な場合や質問がある場合は、こちらまでお気軽にお問い合わせください：support@zohopagesense.com - いつでもサポートいたします。