Conversion tracking

Hello, if you want to track conversion (ie: register in your analytics tools when someone is subscribed), you can use this code:

if ("MutationObserver" in window) {
    var observer = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
          var form = mutation.target;
          if (form.classList.contains('success') && mutation.oldValue != '') {
            // track conversion here
          }
        });
     });

    var subscriptionForms = document.querySelectorAll('form[data-members-form="subscribe"]');

    subscriptionForms.forEach(function (form) {
      observer.observe(form, { 
        attributes: true,
        attributeOldValue: true,
        attributeFilter: ['class'] 
      });
    });
}

Currently it seems like waiting for class changes is the only way. Would be usefull if the membership script triggers an event :grinning:

2 Likes

Which analytics tool are you using? Are you wanting to track a successful email submission?

I’m using fathom and yes, I want to track successful email submission.

2 Likes

I have no idea which paid-member-only post or which Utm_source led people to buy my Ghost premium subscription.

Anyone already done this? Please share your experience.

For example I can add GA or Fathom js code, but can’t understand where to put it - which event to tag

hey! Did you try this code? Did it work?

yes it does

1 Like

Very cool to see this piece of code. Uhm could someone chime in here and tell me where I can paste it? Thanks in advance!

I believe you can add it via code injection in the footer code injection area wrapped in HTML <script> tags:

<script>
// JavaScript here
</script>

Hope this helps!

Thanks David, I got it working now!

Got two follow up questions / remarks though:

  • It triggers the goal when a valid email address is supplied and the form is submitted. If the particular email address is going to verified is not registered. But I believe within the current boundries of Ghost this is not possible, is that correct?

  • After I did a test signup the completion of the goal is counted twice. Any idea why? Does someone else perhaps have the same issue?

From looking at the code in the original post it does appear that the script tracks form submissions, not fully completed sign up flows. Successful sign ups are confirmed by clicking the link within the email sent to the email account they submitted. Clicking the link will send them to your site with an additional query parameter describing the sign up success. There’s an example in our Lyra theme:

You can use this to run tracking code on your site, to work out when members successfully subscribe to your content.

Hope this helps! :blush:

1 Like