Statistics of the spinning wheel

Wishlist Spinning Wheel
1

Please, add this feature so that we can see what is the conversion rate of the spinner! We need to see if the user submitted it on a phone or desktop. Also, which pages converted best.

2 Likes
2

Hi there, @user527 :wave:

Nice idea! We’ll have it in mind and see what others think about it.

By the way, I guess it’s possible to track clicks on the wheel and its form buttons. If you’re interested in this feature, I can discuss it with the devs for you :slightly_smiling_face:

1 Like
3

Great! This way it can easily shows the conversion rate, too :slight_smile:

1 Like
5

Our devs came up with the Google Analytics code for you. Please add this part of the code to your website <head>:

<script async src="https://www.googletagmanager.com/gtag/js?id=UA-ID"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-ID');
</script>

In the code above, you need to replace G-ID with your actual website ID for Google Analytics. This article will help you find your ID - Find your Google tag ID.

And then just add the rest of the code to the Custom JS field on the Settings tab of your widget’s settings:


const EVENT = 'click';

function eappsDispatchAnalyticsEvent(config) {
  function sendEvent(config) {
    if (typeof ga !== 'undefined') {
      ga('send', 'event', {
        eventAction: config.action,
        eventCategory: config.category,
        eventLabel: config.label,
      });
    }
    if (typeof gtag !== 'undefined') {
      gtag('event', config.action, {
        event_category: config.category,
        event_label: config.label,
      });
    }
  }
  sendEvent(config);
}
document.addEventListener(
  'click',
  function ({ target }) {
    if (!target.closest('[class*="eapps-spinning-wheel"]')) {
      return;
    }
    const isWheel = target.closest('[class*="sector__Content-sc"]');
    const isSpinBtn = target.closest(
      '[class*="init-content__FormContainer-sc"] [class*="ButtonBase__ButtonContainer-sc"]'
    );
    const isNoThanksBtn = target.closest('[class*="content__Decline-sc"]');

    if (!isWheel && !isSpinBtn && !isNoThanksBtn) return;

    const label = isSpinBtn
      ? 'Spin button'
      : isNoThanksBtn
        ? 'No,thanks button'
        : 'Wheel';

    eappsDispatchAnalyticsEvent({
      action: EVENT,
      category: 'Elfsight Spinning Wheel',
      label,
    });
  },
  true
);

In Google Analytics, you’ll receive events with the name Click (in event label, you’ll see which element was clicked). If you wish, you can change the name of the event in the 1st line if the 2nd part of the code:

image
image599×428 19.5 KB


Try it out and let me know if it worked :slightly_smiling_face: