バーチャルページビューの設定方法 (URLが変わらないページの計測)

会員登録フォームなどでURLが変わらないページのヒートマップ計測を行うためには、利用者側で以下の作業をしていただく必要がございます。

例として、今回は以下のようにフォームが変わらないURLを参考に設定しましょう。
https://example.com/vpv/form.html

そして、複数存在しているHTMLのページが以下のファイルで構成されているとします。

入力開始ページ: form1.html
確認ページ  : form2.html
登録完了ページ: form3.html

各htmlファイルに解析コード設定 #

  • 1それぞれ3つのファイルに、Ptengineの解析コードを入れます(xxxxxxxx の部分は各プロファイルに紐づいた独自のIDとなります)

    <script type="text/javascript">
        window._pt_lt = new Date().getTime();
        window._pt_sp_2 = [];
        _pt_sp_2.push('setAccount,xxxxxxxx');
        var _protocol = (("https:" == document.location.protocol) ? " https://" : " http://");
        (function() {
            var atag = document.createElement('script'); atag.type = 'text/javascript'; atag.async = true;
            atag.src = _protocol + 'js.ptengine.jp/pta.js';
            var s = document.getElementsByTagName('script')[0];
            s.parentNode.insertBefore(atag, s);
        })();
    </script>
    
  • 2上記の解析コードにある
    「_pt_sp_2.push(‘setAccount,xxxxxxxx’);」というコードの下に、
    それぞれのページファイル別に以下の様に任意のURLを入れたコードを差し込みます。

    form1.htmlに既述する仮想URLタグ

    _pt_sp_2.push('setPVTag,https://example.com/vpv/form.html/input1,replace');
    

    form2.htmlに既述する仮想URLタグ

    _pt_sp_2.push('setPVTag,https://example.com/vpv/form.html/input2,replace');
    

    form3.htmlに既述する仮想URLタグ

    _pt_sp_2.push('setPVTag,https://example.com/vpv/form.html/input3,replace');
    

    例えば、form1.htmlには追加するのは、以下の解析コードとなります。

    <script type="text/javascript">
        window._pt_lt = new Date().getTime();
        window._pt_sp_2 = [];
        _pt_sp_2.push('setAccount,xxxxxxxx');
        _pt_sp_2.push('setPVTag,https://example.com/vpv/form.html/input1,replace');
        var _protocol = (("https:" == document.location.protocol) ? " https://" : " http://");
        (function() {
            var atag = document.createElement('script'); atag.type = 'text/javascript'; atag.async = true;
            atag.src = _protocol + 'js.ptengine.jp/pta.js';
            var s = document.getElementsByTagName('script')[0];
            s.parentNode.insertBefore(atag, s);
        })();
    </script>
    

    これと同様にform2.html、form3.htmlにも仮想ページの一行のコードをそれぞれ追加することで、同じURLを別々のページとして数値を計測することができるようになります。

補足事項 #

また追加のコードのそれぞれの意味はこちらになります。

項目名
フォーマット
必須な値
備考
setPVTag 固定文字列 必須
https://example.com/vpv/form.html/input1 URLや文字列 必須
replace 固定文字列 前の項目にURLを入れた場合は、この"replace"は必須です。文字列の場合は"replace"は入力する必要はありません

仮想ページとして追加するページが外部からアクセスできない場合は、こちらのページを参考に背景ページを設定してください。 バーチャルページビューの背景の設定方法

この記事についてどう思いますか?

  • いいですね!
  • よくないです

評価いただきありがとうございました

  申しわけありません!理由を教えてください。

    サポートチームに直接問合せたい場合、こちらをクリックしてチャットしましょう