¿Cómo añadir metadatos a los eventos personalizados?

Para recopilar datos adicionales además de nuestros eventos, puede añadir metadatos. Con esta función puede especificar parámetros específicos y se incluirán en nuestra base de datos con sus puntos de datos (eventos o páginas vistas).

Consideremos un ejemplo en el que tiene una página de precios que muestra planes de facturación mensuales y anuales: Starter, Business y Enterprise. Como la nuestra en la imagen de abajo.

Digamos que desea realizar un seguimiento del plan que selecciona un usuario además del evento "click_buy" existente que ya recopila. Los metadatos se pueden utilizar para capturar esta información adicional y hacerla útil al aprovechar la "función Objetivos" en Simple Analytics.

Para ilustrar esto, supongamos que tiene dos flujos de registro - uno para el plan Starter y otro para el plan Business. En la imagen de abajo puedes ver que ambos tienen el manejador "onclick" apuntando a la función "click_buy", que envía el evento a Simple Analytics.

<p> <a class="button" href="/signup?plan=starter" onclick="clickBuy()" >Comprar Starter</a > <a class="button" href="/signup?plan=business" onclick="clickBuy()" >Comprar Business</a > </p> <script> function clickBuy() { if (window.sa_event) { window.sa_event("click_buy"); } } </script>

Sin embargo, la configuración actual no captura si el usuario hizo clic en el botón "Starter" o "Business".

Para solucionar esto, puedes modificar la función "click_buy" para incluir información extra (metadatos) para cada plan. Añadiendo un atributo de metadatos al botón "click_buy" en forma de objeto, puede pasar estos datos adicionales a la función "sa_event".

Para añadir información adicional y, en este caso, distinguir entre el plan "starter" y el plan "business", debe añadir {plan: Starter'} para el plan "starter" y {plan: 'Business' } para el plan business entre paréntesis después de "clickBuy".

<p> <a class="button" href="/signup?plan=starter" onclick="clickBuy({plan: 'starter'})" >Comprar Starter</a > <a class="button" href="/signup?plan=business" onclick="clickBuy({plan: 'business'})" >Comprar Business</a > </p>

Además, añade "metadatos " al script para que la función sa_event envíe los metadatos a Simple Analytics.

<script> function clickBuy(metadata) { if (window.sa_event) { window.sa_event("click_buy", metadata); } } </script>

Tu código quedará de la siguiente manera:

<p> <a class="button" href="/signup?plan=starter" onclick="clickBuy({plan: 'starter'})" >Comprar Starter</a > <a class="button" href="/signup?plan=business" onclick="clickBuy({plan: 'business'})" >Comprar Business</a > </p> <script> function clickBuy(metadata) { if (window.sa_event) { window.sa_event("click_buy", metadata); } } </script>

Una vez enviados los metadatos a Simple Analytics, estarán disponibles en el "Explorador de eventos."

Para resumir, este es el proceso para utilizar eventos personalizados con metadatos:

1. Añada metadatos a la función "click_buy" para cada plan (por ejemplo, {plan: 'Starter'} y {plan: 'Business'}).
2. Modifique la función "sa_event" existente en su script para incluir los metadatos.
3. Envíe los metadatos a Simple Analytics mediante la función "sa_event".