Skip to content

Instantly share code, notes, and snippets.

@Shoora
Forked from joseadrian/analytics.ajax.html
Last active February 28, 2019 03:26
Show Gist options
  • Save Shoora/db97870474fcc78620cf to your computer and use it in GitHub Desktop.
Save Shoora/db97870474fcc78620cf to your computer and use it in GitHub Desktop.
analytics.ajax.html
<!--
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
-->
<!--
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
-->
<!--
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: 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
-->
<!--
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
-->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment