Pricing slider how to?

I’m hoping to set up a pricing page where the user can slide a small slide left or right to select what level of price plan they want. I’d like the information above the slide to change to reflect the notch on the slide the person is on, and below the price of that notch to change.

I apologise if I’m using the wrong terms but I hope it’s clear what I mean.

I’m hoping that by having a slide with numerous notches that it will allow a better UX for someone so they can get a solution closer to their budget than would be possible with 3 pricing tables, where they would just select one.

I’m hoping the person could then scroll down, select checkboxes (add-ons) as required, and then make payment via Stripe.

Is this possible without heavy custom work being done, or is this a job for a Gravity Forms and jQuery specialist? Are there any guides on how it could be achieved?


You might consider posting this on the Job Board (or I can move this there.)

I recently saw someone do exactly as you are asking. Here’s a screen recording (gif) of how it’s working right now (still in progress.)

Hi, Im the designer/developer for the example Chris posted above.
Do let me know if I can be of assistance, I would need more details on exactly what you require but yes it looks to be achievable :slight_smile:
Feel free to message me for help! :slight_smile:

1 Like