Rich-text Reply

Track successful order using Stripe as Optimizely Experiment Goal?

teachco 09-08-15

Track successful order using Stripe as Optimizely Experiment Goal?

Hi-

 

We are using Stripe payment processor on our site and would like to use a successful order where the credit card goes through successfully as the Goal of our test.

 

Searched all over and can't find any easy way to track Stripe coming back with approved purchase. 

 

I guess we will have to track the mousedown on the purchase button and just accept that some of the conversions will be overstated because of credit card denials?

 

Thanks in advance.

 

-Michael

Level 2

adzeds 09-09-15
 

Re: Track successful order using Stripe as Optimizely Experiment Goal?

Do you not have a payment success page/receipt page that you can track? So if someone hits the success page then track that as a conversion and push revenue back to Optimizely?
David Shaw
Level 11

Re: Track successful order using Stripe as Optimizely Experiment Goal?

[ Edited ]

Hi @teachco,

 

When the Stripe transaction successfully processes (presumably server-side), is there some sort of client-side communication, perhaps via AJAX?  If the dedicated thank you page as @adzeds suggested doesn't work, you can wrap your existing CC validation logic around an Optimizely custom event goal.  This is the most common and most successful approach our customers take for actions that can't otherwise be tracked by a click or a pageview.

 

Does that serve as a workable approach for you?

Harrison Krat
Solutions Architect | Optimizely, Inc.
harrison@optimizely.com
 
teachco 09-14-15
 

Re: Track successful order using Stripe as Optimizely Experiment Goal?

Hi-

 

Thanks for the responses.

 

Sorry, I should have said in the original question the order success page is not a different url.

Regarding the idea to “wrap your existing CC validation logic around an Optimizely custom event goal”, how exactly would I do that?

 

I am not a developer but I do have access to Google Tag Manager.

 

If I already have been provided a trigger in GTM when an order has happened, is there a specific javascript snippet of code that you can give me that fires the successful order / event goal to Optimizely?

 

Thanks,

 

Michael

Level 2

Re: Track successful order using Stripe as Optimizely Experiment Goal?

Unfortunatly this may not be something you can do using GTM only. When the page changes it changes via AJAX. That said there is some callback that your JS developers make when a successful purchase is made to tell the page to change from the payment screen to the thank you screen. You woudl need to work with the developer to add the custom event / revenue in that callback function. Since the page URL does nto change it will requrie a little but of develoepr help to add the JS.  

Optimizely
teachco 09-16-15
 

Re: Track successful order using Stripe as Optimizely Experiment Goal?

H-

 

Thanks for the replies.

 

I watched the help video for Custom event goals on this page:

 

https://help.optimizely.com/hc/en-us/articles/200039925

 

And saw the attached during the video.

 

1. So I'm first wondering IF the trigger/condition I have been given in GTM by our developers IS sufficient, if the name of my custom event goal is "FinishSubscription", would I put the following in to GTM as a custom javascript tag to only be fired when the order trigger has happened in GTM?

 

window['optimizely'] = window['optimizely'] ||[];
window.optimizely.push(['trackEvent', 'FinishSubscription']);

 

2. If that WON'T work, then I assume the code our developers have looks something like this [please forgive the pseudo code]:

 

if (StripeAuth == true){
    [fire Google Analytics event];
    [do whatever else we need to do after Stripe has given thumbs up];
};

 

but then I would need them to change it so it looks like this:

 

if (StripeAuth == true){
    [fire Google Analytics event];
    [do whatever else we need to do after Stripe has given thumbs up];
    window['optimizely'] = window['optimizely'] ||[];
    window.optimizely.push(['trackEvent', 'FinishSubscription']);
};

 

 

3. Or should I be doing something else?

 

Thanks in advance.

 

-Michael

Optimizely_screenshot_of_custom_javascript_to_fire_custom_event_goal.png
Level 2

Re: Track successful order using Stripe as Optimizely Experiment Goal?

Hi @teachco,

 

  1. Yup, and that's what most customers do when they have events fired via GTM.
  2. Yup, exactly.
  3. You can certainly deploy the custom event via Optimizely's Experiment JavaScript (as this will apply the event to all variations including the original), but you'll want to make sure the code can continue to check the value of the StripeAuth or cartEscape variables beyond just the first firing of the Optimizely code.  You'll want to place the check inside a setInterval function, and then clear the interval once the event has been fired.
var optlyStripe = setInterval(function() {
   if (StripeAuth==true) {
       window.optimizely = window.optimizely || [];
       window.optimizely.push(['trackEvent', 'FinishSubscription']);
       clearInterval(optlyStripe);
   }
 },
50);
  1. You can alternatively use a recursive setTimeout function.  This is preferred from a performance perspective because setInterval is guaranteed to run the number of times that it is called. For example, if there is a heavy JS operation that takes 400ms in the browser, given a 50ms timeout, setInterval will then make your function call 8x in a row when it runs. Using setTimeout, you place your function call into the stack and let it execute when the main thread is not blocked.
var optlyStripe = function() {
   if (StripeAuth==true) {
       window.optimizely = window.optimizely || [];
       window.optimizely.push(['trackEvent', 'FinishSubscription']);
   }
   else {
       setTimeout(optlyStripe, 50);
   }
};

optlyStripe();

 

Does this guidance help?

 

Harrison Krat
Solutions Architect | Optimizely, Inc.
harrison@optimizely.com