Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to implement a Google Adwords "conversion pixel" using ajax on a submit button (no "thank you" page)

I want to implement an adwords "conversion pixel" script - this is the script:

<!-- Google Code for General_Lead Conversion Page -->
<script type="text/javascript">
/* <![CDATA[ */
var google_conversion_id = 000;
var google_conversion_language = "en";
var google_conversion_format = "3";
var google_conversion_color = "ffffff";
var google_conversion_label = "hahaha";
var google_remarketing_only = false;
/* ]]> */
</script>
<script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js">
</script>
<noscript>
<div style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt="" src="//www.googleadservices.com/pagead/conversion/975247275153/?label=IiuoCNO17lcQgZ2P0QM&amp;guid=ON&amp;script=0"/>
</div>
</noscript>

to a contact form on my website which doesn't lead to a "thank you" page. This is my submit form code. (The validation isn't 100% done :P )

// Send button for the "contact form".
$('#sendBtn').click(function(){
    //get info 
    var fullname = $("#fullname").val();
    var email = $("#email").val();
    var text = $("#text").val();
    //send info to php 
    $.ajax({
        beforeSend: function() {
            if ( IsEmail(email) == false) {
                $('#aboutUnsuccess').show("slow");
                $('#contactform').hide("slow");
            }
        },
        url: 'http://www.example.com/contact.php', 
        type: "POST", 
        data: ({ "fullname": fullname, "email": email, "text": text }), 
        success: function (results){
            if ( IsEmail(email) == true) {
                //hide table 
                $('#contactform').hide('slow', function() {
                    $('#contactform').hide( "slow" );
                  });
                //show textboxes
                $('#aboutSuccess').show("slow");
            }
        }
    }); 


});

I tried using .append that I found out it doesn't work after googleing.

and tried to follow this post: How to track a Google Adwords conversion onclick? - which didn't work too

like image 695
Imnotapotato Avatar asked Nov 26 '14 12:11

Imnotapotato


2 Answers

Google supports async conversions:

https://developers.google.com/adwords-remarketing-tag/asynchronous/

Load this script in your html file:

<script type="text/javascript" src="http://www.googleadservices.com/pagead/conversion_async.js" charset="utf-8"></script>

And then call the function google_trackConversion when your user clicks the button:

window.google_trackConversion({
    google_conversion_id: 1234,
    google_remarketing_only: true,
    // ...
});
like image 191
Andreas Louv Avatar answered Nov 15 '22 19:11

Andreas Louv


100% working Google Conversion Tracking concept using Ajax on a submit button :

 $.ajax({
        type: "POST",
        url: "enquiry-submit.php",
        data: data,
        success: function (result) {
          $("#msg").fadeIn(400).html(result);

          /* Conversion Tracking Start */
          var google_conversion_id = YOUR_CONVERSION_ID_HERE;
          var google_conversion_language = "en";
          var google_conversion_format = "3";
          var google_conversion_color = "ffffff";
          var google_conversion_label = "YOUR_CONVERSION_LABEL_HERE";
          var google_remarketing_only = false;

          $.getScript('//www.googleadservices.com/pagead/conversion.js');

          var image = new Image(1, 1); 
          image.src = "//www.googleadservices.com/pagead/conversion/YOUR_CONVERSION_ID_HERE/?label=YOUR_CONVERSION_LABEL_HERE&guid=ON&script=0";  
          /* Conversion Tracking End */
        }
      });

It is working on my Google Ads Campaign.

Note: You must try or test this by clicking on your ad. The effect of conversion will be visible after 15 minutes on your Google AdWords Console

like image 44
Irshad Khan Avatar answered Nov 15 '22 18:11

Irshad Khan