Skip to content

How To Create A Discount Code In ClickFunnels

In this article, you will learn how to create a discount code in ClickFunnels! I personally find it strange that ClickFunnels does not have this feature out of the box but it’s fine. We can still add a coupon code field for customers to use by using a bit of custom coding. Don’t worry, it’s quite simple to do.

You will need the ‘Product ID’ of the products you want to show/hide. You can find the ‘Product ID’ in the URL bar next to the /products/ when editing a product.

How To Create A Discount Code In ClickFunnels

When a promo code is submitted, the code will show the product(s) listed in ‘promoProd’ and hide all the product(s) listed in ‘mainProd’. The code can accept more than one product ID for ‘promoProd’ and ‘mainProd’ in the script below.

You can prevent your users from seeing these promo products flashing on their screen when the page first loads, by hiding your product select element in the CF editor.

Edit the following JavaScript and then add the script to the footer section of your funnels order page:

<script>
var mainProd = '000000';
var promoProd = '000000';
var promoCodes = ['YOURCODE']; //this should always be uppercase
//var head = '<div class="de elHeadlineWrapper de-editable" id="headline-72651" data-de-type="headline" data-de-editing="false" data-title="headline" data-ce="true" data-trigger="none" data-animate="fade" data-delay="500" style="margin-top: 20px; cursor: pointer; outline: none; display: block;"><div class="ne elHeadline lh3 elMargin0 elBGStyle0 hsTextShadow0 elFont_raleway hsSize27" style="text-align: left;" data-bold="inherit" contenteditable="false"><b>Have a Promo Code?</b></div></div>';
var head = '';
var field = '<input type=\'text\' id=\'promo_code\' name=\'promo_code\' placeholder=\'Enter promo code...\' class=\'elInput elInput100 elAlign_left elInputSmall elInputStyl0 elInputBG1 elInputBR5 elInputI0 elInputIBlack elInputIRight elInputStyle1 elInputSmall garlic-auto-save\' />';
$(document).ready(function () {
	$('.elOrderProductOptions').last().after(head + field);
	$('.elOrderProductOptinProductName [value='+promoProd+']').closest('.elOrderProductOptinProducts').hide();
	$('#promo_code').on('keyup', function (ev) {
		if ($.inArray($('#promo_code').val().toUpperCase(),promoCodes) > -1) {
			$('.elOrderProductOptinProductName [value='+promoProd+']').click();
			$('.elOrderProductOptinProductName [value='+mainProd+']').closest('.elOrderProductOptinProducts').hide();
			$('.elOrderProductOptinProductName [value='+promoProd+']').closest('.elOrderProductOptinProducts').show();
		} else {
			$('.elOrderProductOptinProductName [value='+mainProd+']').click();
			$('.elOrderProductOptinProductName [value='+promoProd+']').closest('.elOrderProductOptinProducts').hide();
			$('.elOrderProductOptinProductName [value='+mainProd+']').closest('.elOrderProductOptinProducts').show();
		}
	});
});
</script>

And that’s how to create a discount code in ClickFunnels.

Related Post: How To Delete A Funnel In ClickFunnels

Leave a Reply

Your email address will not be published. Required fields are marked *