First of all, very sorry that this took a some days to get it done for you (it has been quite a busy week for us here at @Funnelish),
Here is a custom code that can do Promo code for you regardless whether you use Funnelish or not and can work in all cases with no limitation, it also does not require much inputs as the above.
<script>
let defaultProductIndices = [1,2]; // Order number of the products to show by default eg. 1st and 2nd Products will be shown by default.
let promoProductIndices = [3,4,5]; // Order number of the products to show by default eg. 3rd, 4th and 5th Products will be shown by default.
let promoCodes = ["CODE#1", "CODE#2"];
let fieldName = 'promo_code_box';
$(function () {
function updatePromos(code){
let promo = ($.inArray(code, promoCodes)>=0);
$('.elOrderProductOptions:first input[name="purchase[product_id]"]:not([id="lbl-01"])').each((i,x)=> {
let p = $(x).closest('.elOrderProductOptinProductName');
if ($.inArray(i+1, (promo ? promoProductIndices : defaultProductIndices))>=0) p.show();
else p.hide();
});
}
$(`input[data-custom-type="${fieldName}"]`).on('keyup', (ev) => {
updatePromos($(ev.target).val());
});
});
</script>
How it works?
The code above will hide/show products when the given promo code(s) are matched with the given promotional product indices. The promo code “box” can be added anywhere on your page using the Clickfunnels page editor (you can also add it to your two step order form through a one line of code).
How to use the code above?
Copy the code above as it is, into your Clickfunnels page Footer Tracking Code box.
Change first linelet defaultProductIndices = [1,2]; to the actual product indices you want to be shown by default when the page loads.
1 refers to 1st product in the list, 2 refers to the 2nd product in the list and so on.
Indices are separated by the comma within the two brackets [1,2,3…etc]
Change the second linepromoProductIndices = [3,4,5]; the same as the first one, but this time add the indices of the products to be “shown” when a customer enters a valid promotional code.
Add your valid promo code in the 3rd linelet promoCodes = ["CODE#1", "CODE#2"];, Replace “CODE#1” and “CODE#2” with your actual promo codes, you can as many valid promo codes as you want, comparison will be case sensitive ie. “CODE#1” and “code#1” are not the same.
Add a custom input field box into your order form page, name it any custom name.
This box will be used to input the Promotional code by your customers.
Copy the box custom name and replace “promo_code_box” in 4th line.
That’s it, save changes and test it out.
Let us know if the code above needs altering or you face any challenges while using it,