0

訪問者がAJAXお問い合わせフォームの送信ボタンをクリックするたびに追跡したいと思います。Google Analyticsでイベントを作成し、送信ボタンのコードにJavaScriptを追加する予定です。

これは現在の送信ボタンコードです：

<button class="button" title="Send" type="submit"><span><span>Send</span></span></button>

カテゴリやアクションなどを追加した後のコードは次のようになります。

<button class="button" title="Send" type="submit" onClick="_gaq.push(['_trackEvent', 'Contact', 'Inquiry', 'Inquiry Form', 0, false]);"><span><span>Send</span></span></button>

これは正しいです？助言がありますか？ありがとう！

更新-これは、ある種のフォーム検証が表示されるjavascriptです。Crayon Violentが提案したように、失敗したフォーム送信の追跡は避けたいと思います。ここで問題となるのは、成功したフォームの送信のみを追跡できるように、GoogleAnalyticsコードをどこに追加するかです。注：サイト所有者のプライバシーを保護するために、ドメイン/ブランドを「XXXXXX」に置き換えました。また、2つのフォームへの参照があることに注意してください。1つは連絡フォームで、もう1つは求職者が履歴書を送信するためのフォームです。はい、同じページに両方のフォームを含めて同時に表示するのは少し面倒ですが、ユーザーを混乱させる可能性がありますが、そのビットは私に依存していません:(

<script type="text/javascript">
//<![CDATA[
var contactForm = new VarienForm('contactForm', true);
var contactFormCv = new VarienForm('contactFormCv', true);

jQuery(function(){

jQuery('#contactForm input, #contactForm textarea').each(function(){
jQuery(this).focus(function(){
jQuery(this).css({'background-position': '1000px 1000px'});
}).blur(function(){
if(jQuery(this).val() == ''){
jQuery(this).css({'background-position': '5px 9px'});
            }
});
});

jQuery('#contactForm').submit(function(){

jQuery('.form-column .message', form).remove();

var form = jQuery(this);
var message = jQuery('<div class="message"></div>');

jQuery('.form-column', form).append(message);

if(contactForm.validator.validate()){

jQuery(message).html('<img                  src="http://www.XXXXXX.com/skin/frontend/np/XXXXXX/images/XXXXXX/sending-contact.gif" />');

            var data = '';
            jQuery('input, select, textarea', this).each(function(){
                var name = jQuery(this).attr('name');
                var val = jQuery(this).val();

                data = data+name+'='+val+'&';

            });

            jQuery.ajax({
                type: "POST",
                url: jQuery(this).attr('action'),
                data: data,
                success: function(data){
                    if(data == 'true'){
                        jQuery('input, select, textarea', form).val('').css({'background-position': '5px 9px'});
                        jQuery(message).html('Mensaje enviado.');
                    }
                }
            });
        }
        return false;
    });

    var iframe = jQuery('<iframe></iframe>').attr({id: 'uploadcv', name: 'uploadcv', scrolling: 'none', frameborder: 0}).addClass('uploadcv').css({height: 0, width: 0, border: 0, display: 'none'});
    jQuery('#contactFormCv').attr({target: 'uploadcv'}).submit(function(){

        var form = jQuery(this);
        var message = jQuery('<div class="message"></div>');

        form.after().append(message);

        if(contactFormCv.validator.validate()){
            jQuery(message).html('<img src="http://www.XXXXXX.com/skin/frontend/np/XXXXXX/images/XXXXXX/sending-contact.gif" />');
            iframe.load(function(){
                jQuery('input, select', form).val('');
                jQuery(message).html('Mensaje enviado.');
            });
        }

    }).after().append(iframe);

});

//]]>

4

1 に答える 1

3

基本のページ上のGAコードがあると仮定すると、それは「機能する」はずですが、現在持っている場所の動作について考慮すべきことがあります...そのコードは、ボタンが押されるたびにトリガーされます。したがって、フォームの検証（サーバー側またはクライアント側）があり、訪問者がフォームに正しく入力できず、エラーメッセージが表示された場合は、フォームの送信の失敗を追跡しただけです。ここで、訪問者が再試行して失敗したとします。これで2つのヒットがあります。3回目は魅力的で、彼はそれを正しく理解し、フォームが正常に送信され、GAに3つのヒットが表示され、それらのヒットのどれだけが成功したかわかりません。あなたがこれを気にしないのなら、あなたは行ってもいいです。

ただし、ベストプラクティスとして、ほとんどの人は追跡を実装して、成功か失敗かを分類するために異なる値をトリガーするか、成功したフォーム送信のみを追跡します。したがって、フィールドが正しく入力されていることを確認するためにページにJavaScriptフォームの検証がある場合は、検証に合格した後、そのGAコードを検証コード内に配置する必要があります。または、フォーム検証コードがサーバー側の場合は、代わりに「ありがとう」ダイアログが返されたコードを出力する必要があります。

投稿されたコードに応答するように編集：

フルページのコンテキストまたはテストなしで100％になることはできませんが、ここに配置することをお勧めします。

success: function(data){
  if(data == 'true'){
    jQuery('input, select, textarea', form).val('').css({'background-position': '5px 9px'});
    jQuery(message).html('Mensaje enviado.');
    _gaq.push(['_trackEvent', 'Contact', 'Inquiry', 'Inquiry Form', 0, false]);
  }
}
于 2013-02-12T19:35:40.517 に答える