javascript - library - Cómo implementar un "píxel de conversión" de Google Adwords usando ajax en un botón de envío(no hay página de "gracias")

jquery.min.js cdn

Question

Quiero implementar un script de "píxel de conversión" de AdWords: este es el 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>

a un formulario de contacto en mi sitio web que no lleva a una página de "agradecimiento". Este es mi código de formulario de envío. (La validación no está 100% hecha: 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");
            }
        }
    }); 


});

Intenté usar .append que descubrí que no funciona después de buscar en Google.

y traté de seguir esta publicación: ¿Cómo hacer un seguimiento de una conversión de Adwords de Google en un clic? - que tampoco funcionó

Answer 1

Concepto de seguimiento de conversiones de Google que funciona al 100% utilizando Ajax en un botón de envío:

 $.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 */
        }
      });

Está funcionando en mi campaña de anuncios de Google.

Nota: debe probar o probar esto haciendo clic en su anuncio. El efecto de la conversión será visible después de 15 minutos en su Consola de AdWords de Google

Answer 2

Función para crear iframe y poner el código de AdWords en el archivo thanks.php

function conversionTracker()  {
                var  iframe = document.createElement(''iframe'');
                iframe.style.width = ''0px'';
                iframe.style.height = ''0px'';
                document.body.appendChild(iframe);
                iframe.src = ''thanks.php''; //Make sure path is correct! (update with bloginfo var for nebula)
            };
call conversionTracker() in ajax success function
....
success: function(response){
conversionTracker();
}

luego crea un archivo thanks.php y coloca el código de AdWords en este archivo

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Thank You</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">

</head>
<body>
    <!-- Google Code for Frachiseglobal Conversion Page -->
    <script type="text/javascript">
    /* <![CDATA[ */
    var google_conversion_id = 1234;
    var google_conversion_language = "en";
    var google_conversion_format = "3";
    var google_conversion_color = "ffffff";
    var google_conversion_label = "dummy";
    var google_conversion_value = 1.00;
    var google_conversion_currency = "INR";
    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/1234/?value=1&amp;currency_code=INR&amp;label=dsfdsf&amp;guid=ON&amp;script=0"/>
    </div>
    </noscript>
</body>
</html>

Nota: aquí label y conversion_id son valores falsos, por favor, ponga los suyos.

Answer 3

Google soporta conversiones asíncronas:

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

Cargue este script en su archivo html:

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

Y luego llame a la función google_trackConversion cuando su usuario haga clic en el botón:

window.google_trackConversion({
    google_conversion_id: 1234,
    google_remarketing_only: true,
    // ...
});

Answer 4

 $.ajax({
   dataType: "script",
   cache: true,
   url: ''https://www.googleadservices.com/pagead/conversion_async.js''
 }).done(function () {
   isInitialized = true;
 });

google_trackConversion({
   google_conversion_id: 12345,
   google_conversion_language: "en",
   google_conversion_format: "3",
   google_conversion_color: "ffffff",
   google_conversion_label: "label",
   google_conversion_value: 0,
   google_remarketing_only: false
});