Smart Form Pages Using CSS

Using CSS to Maximize Your Form’s Max Quantities

William Nicholls

Last Update a year ago

Using CSS to Maximize Your Form’s Max Quantities

Making the form work beautifully, seamlessly and with maximum friendliness to shop visitors

The Max Quantities feature is one of our more recent Maltix release , its brilliant. It allows you to limit the number of times an option can be picked in a form. If a customer is filling out a field with this applied, they’ll see exactly how many times that option can be picked. It’ll look a little bit like this:

However, not everyone would be a fan of showing how many t-shirts they have left. It’s not possible to directly get rid of the text showing this, but CSS is around to save the day. With CSS it’s possible to target that piece of text, it’s possible to hide it. The CSS is mega simple as well. Check it out:

The colour of the text has just been made transparent, which will make it disappear from the form. When applied, it’ll look like this:

All of those options still have the max quantities applied, but only small shirts, which have run out of stock will show the amount remaining. That way the user isn’t a bit confused when they can’t pick the small shirt they so desperately want. The same fate would be in store for the other shirts, if they were to run out of stock.

What’s that? You want the text for out of stock options to be gone as well and you need CSS to cancel its holiday to help you again? We Just add a tiny bit more CSS like this.

You will notice when the option has been disabled and will once again hide the text from the form. When applied, it’ll look like this:

Maltix Smart Form Shops are a brilliant tool in collaboration with Phonesite and PWA

Was this article helpful?

0 out of 0 liked this article

Still need help? Message Us