ウェブサイト設定

ウェブサイト設定

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

Zoho PageSense のWebサイトセクションでは、PageSense が Webサイトとどのように接続・連携するかに関する設定を行えます。これには、トラッキングスニペットのインストール、ブラウザー通知の有効化、訪問者が更新情報を購読する方法の管理などが含まれます。

これらの設定により、PageSense が訪問者の行動をトラッキングし、実験を実行し、インサイトを収集し、通知を通じてユーザーと直接コミュニケーションできるようになります。

Webサイト設定には、通常次のセクションが含まれます:

  • Snippet– Webサイトに PageSense のトラッキングコードをインストールして検証します。
  • Web Push Notifications– 訪問者が Webサイトからのブラウザー通知を購読できるようにします。

各セクションは、PageSense が訪問者の活動をトラッキングし、ユーザーとのエンゲージメントを高めるうえで重要な役割を果たします。

Snippet

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

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

スニペットを正しくインストールすることで、PageSense は訪問者を一貫してトラッキングし、正確な分析結果と実験結果を提供できます。

Notesメモ:設定アイコンは、PageSense 操作画面の右上にあります。そこからWebサイト → Snippetに移動して、プロジェクト用のコードスニペットにアクセスできます。

Code Snippet

PageSense では、訪問者の指標を収集するために Webサイトへインストールする必要があるJavaScript トラッキングスニペットを提供しています。
Webページ上でスクリプトをどのように読み込むかに応じて、3 種類のスニペットから選択できます:
  • 同期スニペット (Synchronous snippet)
  • 非同期スニペット (Asynchronous snippet)
  • Smart Code スニペット
各オプションにより、PageSense スクリプトが Webサイト上の他のスクリプトとどのように読み込まれ、連携するかが決まります。
Synchronous Snippet
Synchronous snippetは、Webページ上の他のスクリプトと順番に読み込まれます。つまり、ブラウザーは PageSense スクリプトの読み込みが完了するまで待機し、その後で他のスクリプトの処理を続行します。
同期スニペットを使用するタイミング:
  • Webサイトでスクリプトを厳密な順序で実行する必要がある場合
  • 他のスクリプトより先に PageSense を読み込ませたい場合
  • PageSense が先に読み込まれていることを前提とした高度なカスタムスクリプトを実行している場合
ただし、同期スクリプトは読み込み中に一時的に他のスクリプトをブロックするため、ページが重い場合はパフォーマンスにわずかな影響が出る可能性があります。
そのため、ほとんどの最新の Webサイトでは、同期スニペットではなく非同期スニペットまたは Smart Code の利用を推奨します。


Asynchronous Snippet
Asynchronous snippetは、ページ上の他のスクリプトをブロックせずに独立して読み込まれます。ブラウザーは、PageSense スクリプトをバックグラウンドで読み込みながら、他の要素の読み込みを続行します。

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


Smart Code Snippet
Smart Code スニペットは、PageSense を利用するほとんどの Webサイトに推奨される実装方法です。
Smart Code は、スクリプトの読み込み方法や Webサイトとの連携を自動的に最適化します。実験実行時のフリッカーを軽減し、ページの表示速度を向上させるようにスクリプトの実行をインテリジェントに制御します。


Smart Code のメリット
  • スクリプトの読み込みを自動的に最適化
  • A/B テストやパーソナライズ実験の実行時のフリッカーを軽減
  • ページの読み込みパフォーマンスを向上
  • ユーザー体験に影響を与えずに、実験をスムーズに実行
A/B テスト、Split URL テスト、パーソナライズキャンペーンを実行している Webサイトでは、Smart Codeを使用することで、最も信頼性が高く最適化されたパフォーマンスを得られます。


スニペットをインストールすると、PageSense はCookieを使用して訪問者の操作をトラッキングし始めます。これらの Cookie により、再訪問ユーザーの識別や、実験および分析のためのセッション継続が可能になります。


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

Cookie 同意およびプライバシー設定の構成方法については、コンテンツとプライバシー設定のヘルプドキュメントを参照してください。

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

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


Tag Manager 経由でスニペットを設定する詳細な手順については、PageSense GTM 連携ガイドを参照してください。

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

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

  1. PageSense のSnippetセクションからコードスニペットをコピーします。
  2. Webサイトの各ページの<head>タグ内にスニペットを貼り付けます。
  3. Webサイト上で変更内容を保存し、公開します。
インストールが完了すると、PageSense は訪問者の操作をトラッキングし、分析および実験用のデータ収集を開始します。

インストールの確認

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

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

例 : https://##PROTECTED_0##

Webプッシュ通知

Webプッシュ通知セクションでは、Zoho PageSense からブラウザー通知を有効にし、訪問者が購読してWebサイトから直接更新情報を受け取れるようにできます。これらの通知を使うことで、訪問者がWebサイトを閲覧していないときでも、新しいコンテンツやキャンペーン、製品アップデート、お知らせなどのアラートを送信し、再訪問を促すことができます。

通知を受け取る前に、訪問者はWebサイト上に表示される購読プロンプトで通知の許可を与える必要があります。PageSense では、この購読プロンプトをどのようなタイミング・方法で表示するかを制御できる、複数のオプトイン方法を提供しています。
Notesメモ:[設定] アイコンは PageSense の画面右上にあります。[Webサイト] → [Webプッシュ通知]に移動して、通知購読の設定を行ってください。

ユーザーに購読を許可する

購読者の収集を開始するには、まず訪問者がWebサイトからの通知を購読できるようにするオプションを有効にする必要があります。有効にすると、PageSense によって通知の許可を求める購読プロンプトが訪問者に表示されます。

訪問者が購読すると、PageSense キャンペーンから送信されるブラウザー通知を受け取れるようになります。

オプトインの種類

PageSense では、購読の許可を取得するために複数のオプトイン方式を用意しています。各方式は異なるユーザー体験を提供し、通知の許可をどのように提示したいかに応じて選択できます。

ワンステップ・オプトイン

ワンステップ・オプトイン方式では、ブラウザーのネイティブな通知許可プロンプトが直接訪問者に表示されます。ユーザーがWebサイトにアクセスすると、ブラウザーが通知を許可するかどうかを確認します。


このオプションでは、ブラウザーの許可ダイアログを使って、訪問者がすばやく購読できます。

ワンステップ・オプトインを使用するタイミング

この方式は次のような場合に適しています。

  • Webサイトに対して訪問者からの信頼がすでに高い場合
  • シンプルで迅速な購読プロセスにしたい場合
  • WebサイトがHTTPSを使用している場合

許可プロンプトを表示するタイミングは、ページにアクセスした直後や、数秒後など、任意に設定できます。

Service Worker の要件

プッシュ通知を有効にするには、Webサイトのルートディレクトリにservice worker ファイルが存在している必要があります。

ファイルが存在しない場合は、次の名前でファイルを作成してください。


                         

                          

                           service-worker.js

このファイルをWebサイトのルートディレクトリに配置し、公開アクセス可能であることを確認してください。このファイルにより、ユーザーがサイトを閲覧していないときでも、ブラウザーが通知を配信できるようになります。
ツーステップ・オプトイン
ツーステップ・オプトイン方式では、ブラウザーの通知許可プロンプトを表示する前に、Webサイト上にカスタムメッセージまたはオプトインボックスを表示します。
訪問者はまず、なぜ通知をリクエストしているのかを説明するメッセージを目にします。[許可] ボタンをクリックすると、その後でブラウザーの正式な許可リクエストが表示されます。


ツーステップ・オプトインを使用する理由
ツーステップ・オプトインは、次の理由から推奨されます。
  • ユーザーの信頼性と透明性を高められる
  • 購読率を向上できる
  • 最新のブラウザーの通知ポリシーとより相性がよい
オプトインメッセージの各要素は、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 - までお気軽にお問い合わせください。