Show discounted pricing on order form

Rather than just having a promotional code, is there a way to show discounts on products? I want to have products marked down from their original price during certain periods of time. For example, if an item's regular retail is $3.99, I want it to have a strikethrough and another pricing in red reading $2.99.

If possible I would also like it to show: "offer ends Feb 1st, 2021".

Is this possible???

We don't have that with our payment field, but it can be achieved manually by injecting a CSS into your form.

You can give us the list of products and the value you want to put then we'll provide you with CSS which you can add to your form.

Looking forward for your response.

So does this have to be done every time we have any promotion? Just seems like a hassle if we have close to 60 products on special 4-6 times a year and we need to ask for CSS code everytime.

Hi there,

Happy to help!

So you would only need to update parts of the CSS coding (which we would certainly show you how to do so) in regards to the pricing especially, since the products you'd be updating would be "housed" in the same elements in regards to CSS.

We can certainly show you how this would be done if you'd like to share a brief list of products with us.

We await your response.

Thanks Katherine. This would be across all products - it is just the timing that varies. For example, all 3 C4 products will be on sale from $28 --> $23.80 during the months of April, June, August, November:

Frozen Bombsicle (473mL) (12)

Tropical Blast (473mL) (12)

Twisted Limeade (473mL) (12)

Hope this gives you an idea of what CSS we would need to input.

Thanks

When the month of April onwards comes, change the original price from 28 to 23.80 so it would checkout the discounted price then inject the $28 slash off price for Frozen Bombsicle, Tropical Blast, Twisted Limeade.

Here's the code:

#cid_9 > div > div:nth-child(5) > span:nth-child(2) > div > div.form-product-container > span:nth-child(1) > span > b > span:before {

  content: "$28";

  color: red;

  text-decoration: line-through;

}

#cid_9 > div > div:nth-child(5) > span:nth-child(4) > div > div.form-product-container > span:nth-child(1) > span > b > span:before{

  content: "$28";

  color: red;

  text-decoration: line-through;

}

#cid_9 > div > div:nth-child(5) > span:nth-child(6) > div > div.form-product-container > span:nth-child(1) > span > b > span:before{

  content: "$28";

  color: red;

  text-decoration: line-through;

}

Guide: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

Let us know if you need further help.

Thanks Jed, I appreciate the detailed outline of how to do this.

I assume I would be able to insert the same CSS code for other products to achieve the same effect (but just change the price under 'content')?

Hi there,

On behalf of my colleague, we are happy to help!

Yes: you could certainly inject the same CSS code and change the price for each product.

Please let us know if we can assist further.