html Registro de eventoopáginaparaobtener conteo de registrados utilizando Google Analytics

Posted 2021-05-11

<!-- 
  Ejemplo: 
  
  Página: dominio/formulario 
  API: ga.js
-->
<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXXX-X']);
  <?php if( ! isset($_POST['accion'])): // O la condición necesaria 
  ?>
  _gaq.push(['_trackPageview']);
  <?php else: ?>  
  _gaq.push(['_trackPageview', '/gracias']); // Página de ejemplo
  <?php endif; ?>

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
  
</script>

<form method="post">
  Nombre: <input type="text" name="nombre" placeholder="Ingres tu nombre">  
	<input type="submit" name="accion" value="Registrarme">
</form>

<!--   
  La URl del formulario y la URL del destino (donde se procesa el registro) deben ser diferentes
  para poder crear el objetivo y se pueda analizar mejor el flujo.

  Info sobre registro de páginas y eventos en ga.js
  https://developers.google.com/analytics/devguides/collection/gajs/methods/gaJSApiBasicConfiguration#_gat.GA_Tracker_._trackPageview
  https://developers.google.com/analytics/devguides/collection/gajs/eventTrackerGuide?hl=es
-->

<!-- 
  Ejemplo: 
  
  Página: dominio/formulario 
  API: ga.js
-->
<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXXX-X']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>

<form method="post">
  Nombre: <input type="text" name="nombre" placeholder="Ingres tu nombre">	
	<input type="submit" value="Registrarme">
</form>

<script>
$('form').on('submit', function(e){
  e.preventDefault();
	
  /* 
   * Se puede utilizar el trackeo de página
   * 
   * _gaq.push(['_trackPageview', '/pagina'])
   *
   * Pagina de Ej: /gracias/especialidad-1
   *               /especialidad-1/gracias
   *               /formulario/gracias
   *
   * Lo que se crea conveniente, o como estén manejando las URLs
   */  
  _gaq.push(['_trackPageview', '/gracias']); // Página de ejemplo

  /* 
   * O
   * Se puede utilizar el trackeo de evento
   *  
   * _gaq.push(['_trackEvent', 'Categoria', 'Accion', 'Etiqueta','Valor']);
   */
  _gaq.push(['_trackEvent', 'Videos', 'Play', '']); // Datos de ejemplo
  
	// Enviar el formulario
	// $.post('ruta-para-registrar', {}, function(){});
});	
</script>
<!--   
  La URl del formulario y la URL del destino (donde se procesa el registro) deben ser diferentes
  para poder crear el objetivo y se pueda analizar mejor el flujo.

  Info sobre registro de páginas y eventos en ga.js
  https://developers.google.com/analytics/devguides/collection/gajs/methods/gaJSApiBasicConfiguration#_gat.GA_Tracker_._trackPageview
  https://developers.google.com/analytics/devguides/collection/gajs/eventTrackerGuide?hl=es
-->

<!--
  Página: dominio/formulario
  NO AJAX 
  
  Insertar el codigo por defecto de Google Analytics o Universal.
  Ya que la página del formularo es diferente a la página de destino.
  
  Página formulario: dominio/formulario
  Página destino:    dominio/formulario/pagina-destino-de-ejemplo
-->
<script type="text/javascript"><!-- Codigo por defecto de Google Analytics, Básico o Universal --></script>
 
<form action="dominio/formulario/pagina-destino-de-ejemplo" method="post">
  Nombre: <input type="text" name="nombre" placeholder="Ingres tu nombre">  
  <input type="submit" name="accion" value="Registrarme">
</form>

<!-- 
  Ejemplo: 
  
  Página: dominio/formulario 
  API: analytics.js 
-->
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-XXXXXXXX-X', 'dominio'); 
   
  <?php if( ! isset($_POST['accion'])): // O la condición necesaria ?>
  ga('send', 'pageview'); 
  <?php else: ?>
  ga('send', 'pageview', '/gracias');  // Página de ejemplo
  <?php endif; ?>
</script>

<form method="post">
  Nombre: <input type="text" name="nombre" placeholder="Ingres tu nombre">	
	<input type="submit" name="accion" value="Registrarme">
</form>
<!--   
  La URl del formulario y la URL del destino (donde se procesa el registro) deben ser diferentes
  para poder crear el objetivo y se pueda analizar mejor el flujo.

  Más info sobre registro de páginas y evemtps en analytics.js
  https://developers.google.com/analytics/devguides/collection/analyticsjs/pages
  https://developers.google.com/analytics/devguides/collection/analyticsjs/events 
-->

<!-- 
  Ejemplo: 
  
  Página: dominio/formulario
  API: analytics.js
-->
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-XXXXXXXX-X', 'dominio'); 
  ga('send', 'pageview');  
</script>

<form method="post">
	Nombre: <input type="text" name="nombre" placeholder="Ingres tu nombre">	
	<input type="submit" value="Registrarme">
</form>
 
<script>
$('form').on('submit', function(e){
  e.preventDefault();
	
  /* 
   * Se puede utilizar el trackeo de página
   * 
   * ga('send', 'pageview', '/pagina')
   *
   * Pagina de Ej: /gracias/especialidad-1
   *               /especialidad-1/gracias
   *               /formulario/gracias
   *
   * Lo que se crea conveniente, o como estén manejando las URLs
   */  
  ga('send', 'pageview', '/gracias'); // Página de ejemplo

  /* 
   * O
   * Se puede utilizar el trackeo de evento
   *  
   * ga('send', 'event', 'Categoria', 'Accion', 'Etiqueta', 'Valor');
   */
  ga('send', 'event', 'Formulario', 'Registrar', 'Una especialidad u otra cosa'); // Datos de ejemplo
  
	// Enviar el formulario
	// $.post('ruta-para-registrar', {}, function(){});
});	
</script>
<!-- 
  Adaptar si se utiliza otro framework.
  
  La URl del formulario y la URL del destino (donde se procesa el registro) deben ser diferentes
  para poder crear el objetivo y se pueda analizar mejor el flujo.
  
  Más info sobre registro de página y eventos con analytics.js 
  https://developers.google.com/analytics/devguides/collection/analyticsjs/pages
  https://developers.google.com/analytics/devguides/collection/analyticsjs/events 
-->