Rich-text Reply

Triggering A Pop-up When Order Amount Is Over $X

egurock 10-01-15

Triggering A Pop-up When Order Amount Is Over $X

i want to run a test where if a customer adds more than $150 worth of product to their shopping cart, a pop-up appears asking them if they need help. Anyone have any idea how to build such an experiment?

 

thanks,

Eli

Level 2

JDahlinANF 10-02-15
 

Re: Triggering A Pop-up When Order Amount Is Over $X

When the add-to-cart process completes, your DEV team exposes the current cart total and fires a trigger (possibly, the trigger passes the current cart total in the trigger... lots of ways to accomplish this part).
When you hear that trigger, you read the current cart value and pop the modal (if the user is in the "On" group)

Re: Triggering A Pop-up When Order Amount Is Over $X

Hi @egurock,

 

Thanks for contributing to the Optiverse! I'm Becca Bruggman a Solutions Architect at Optimizely and wanted to chime in here to build off of the spot on suggestion that @nap0leon provided.

 

So, as @nap0leon mentioned, you would need to include some way to expose this "Current Cart Value" on the page, likely via some programmatic logic.

 

From there, you could build an Optimizely experiment that would only fire if that value was over the $150 threshold you had designated. This can be accomplished through our experiment activation mode called "Conditional Activation" which basically looks for a certain designated condition to be true (in the this case the cart value being a certain value) and then executes the experiment code to trigger the pop-up.

 

Did I explain the above well? Did you have any follow-up questions or feedback?

 

Thanks,
Becca

egurock 10-15-15
 

Re: Triggering A Pop-up When Order Amount Is Over $X

Thanks for the help. Is there any documentation on how to do what you are saying? Something I can provide to my development team?

 

thanks,

Eli

Level 2
JDahlinANF 10-15-15
 

Re: Triggering A Pop-up When Order Amount Is Over $X

@egurock

 

A couple approaches come to mind.

I like @Becca_Bruggman's suggestion of using conditional activation which could easily be applied to the methods #2 and #3 below.

 

1- Your DEV team places the "current cart value" in an HTML element on the page.  If your page already has a shopping cart element on it that indicates how many items are in their cart, the value of the items could be a data-attribute on the cart.  e.g.,

<div class='cart-indicator' data-cart-value='79.95'>...</div>

Your variation code could read the value of this data attribute and pop the modal.  This approach would work if you want the modal to show on the first page hit after their cart value exceeds your threshold (you would probably want to exclude the checkout pages from the experiment).

 

You would also need to cap how often this modal appears - you wouldn't want it to fire on every page hit.

 

2- Building on the first approach - you could have your DEV team fire a trigger when a user has added an item to their cart (after they have updated the data-cart-value attribute).  With this approach, you could fire the modal on the same page as the add-to-cart event.

 

$(window).trigger('addToCartComplete');

Your code would look like this:

window.$(window).on('addToCartComplete',function(){
	try {
		var cartValue = parseInt($('.cart-indicator').attr('data-cart-value'));
		if (cartValue >= 150) {
			//code that create the modal
    } else {
    }
	} catch(e) { } 
});

3- Similar to #2 but slightly different - your DEV team could call a trigger and pass the current cart value in the trigger.  Like this:

$(window).trigger('addToCartComplete','151.75');

Which would make your code look like this:

window.$(window).on('addToCartComplete',function(event, data){
	try {
		var cartValue = parseInt(data);
		if (cartValue >= 150) {
			//code that create the modal
    } else {
    }
	} catch(e) { } 
});