Adding Extra Products To Checkout Page (Upsells, Hidden Fees, Free Gifts, Order Bumps)

This article will show you how to offer an additional product to the checkout page to be purchased at the same time as the main offer.

This can be accomplished by including an HTML checkbox input with the attributes class="kformCheckoutUpsell" and value="[productId]", where [productId] is the campaign product ID of the campaign product you are offering.. You can also set the quantity on these inputs using the attribute quantity. If the quantity attribute is not present, the quantity will default to 1.

kformCheckoutUpsell offers process at the same time as the main offer and will bill on the same transaction if assigned to the same gateway as the main offer and Stand Alone Transaction is not checked on campaign product configuration.

If separate transactions, kformCheckoutUpsell offers might successfully bill despite a decline on the main offer.

If you want to bill the hidden charge as a separate transaction and make sure it does not bill if the main offer declines, you might want to add it as an automatically submitted upsell page.

The javascript to submit kform is:

• kform.validator.formSubmit();

There are a number of scenarios in which you may wish to add additional products to the checkout page:

Extra Upsell

You have an upsell product that you want to allow the customer to be able to select directly from the checkout page. For example, an optional shipping insurance. In the following example, the upsell is prechecked. You could change this by removing the checked attribute from the element:

• <input type="checkbox" checked="" value="12" class="kformCheckoutUpsell">

  This will purchase campaign product 12.

• <input type="checkbox" value="5" quantity="3" class="kformCheckoutUpsell">

  This will show the option to purchase 3 of campaign product 5.

Hidden Charge

You have a hidden charge for an additional product that you would like to pass from the checkout page. This is the same as the checkbox above with the exception that you hide the checkbox from the user by adding the style='display:none' attribute to the checkbox element.

• <input type="checkbox" style="display:none" checked="" value="[productId]" class="kformCheckoutUpsell">

Free Gift

You need to send a free gift along with a product purchase. This is the same as a hidden charge, the only difference being that you would need to ensure that the price for the campaign product is set at zero.

• <input type="checkbox" style="display:none" onclick="kform.updateCart()" checked="" value="[productId]" class="kformCheckoutUpsell">

  You might also consider adding free gifts using combinations and rotations in base product configuration.

Multi-Product Landers

On Multi-product landers, you may wish for free gifts or hidden charges to be dependent upon the primary offer selected. This can be accomplished via javascript by manipulating the upsell checkboxes.