Font size,payment and conditinal logic in Ticket Purchase widget

Hello, although I was a programmer many years ago, I don't know CSS and I'm nervous about changing or adding anything in the custom CSS text box!

1. I need to change the font size of the items listed in the Ticket Purchase widget to match the rest of the form - it looks like the rest of my form is 14pt (which seems a bit large?).
2. Also, I'm not seeing the check box next to each item which I'd like to add, since it's not intuitive for the user to just click the item 'box'.
3. I'd also like the user to be able to select more than one place in a workshop - they may be signing up for a friend as well.

In reading the answers to similar question #3, I've also added the Gift Registry widget, which doesn't appear to solve any of the issues above.

Advice would be appreciated!

Lise

Form: https://www.jotform.com/build/242115035642143

BTW, how do I make this a 'Calculation' field? The total cost of the choices made by the user will need to be shown as the total they'll be paying, and also passed to the Payment Gateway....

Hi Lise,

Thanks for reaching out to Jotform Support. Adding CSS to your form is simple, here's a guide you can check out, however you can adjust the font from a menu. Let me show you how to do it:

1. In Form Builder, click the Paint roller icon on the right side.

2. Go to the Styles tab.

3. Set the Font Size option, and input your preferred size, you can adjust Question Spacing too if you'd like since the fonts will change. In Gift Registry widget, did you mean these checkboxes? If you specify the conditional logic you need in the Gift Registry widget, I can help you better. You can also add the other places in the workshop by editing "Item 1" fields, as you mentioned.

Lastly, let me show you how to add a payment integration to your form, for example PayPal integration:

1. Click on the Add Form Element menu on the left side of the Form Builder page.

2. Under the Payments tab, choose one of the PayPal options.

3. In the panel on the right side of the page, click on Connect. This will take you to the PayPal page.

4. Now, enter all the necessary information and connect your PayPal account with your form. That's it. You're done.

If you'd like more information about the payment limits, check out Jotform's Pricing page.

Give it a try and reach out again if you need any other help.

Thank you Cecilia, but your answer doesn't address any of my questions.

You may want to take a look at my form to see what it currently contains.

1. I have altered the font size, as you suggested, but - as I feared - it has changed all the font sizes in the text of my form EXCEPT the fields in the Ticket Purchase widget, which are still crazy large.
2. I am still not seeing a checkbox next to each item in either the Ticket Purchase or the Gift Registry widgets
3. I don't know what conditional logic is required to make the Gift Registry display properly, you didn't explain that. I am familiar with using conditional logic in my forms, so don't need the tutorial, thanks.
4. You didn't address my question #3 in my original request - how to enter a number in the Ticket Purchase or Gift Registry items so the user can book more than one place in a workshop. I'm sure I'm not alone in asking this.
5. If you look at my form, you'll see that I have already successfully integrated the Square payment gateway, and don't need instructions to do that. What I asked was how I could pass on the total fees from either of the widgets to the payment gateway amount.

All in all, I'm wondering whether you were answering someone else's question, as none of my issues have been addressed!

Lise

Hi Lise,

I understand what you’d like to do, but I’ll need a bit of time to work out a solution. I’ll get back to you shortly.

Thanks for your patience, we appreciate it.

Hi Lice,

For the font size of the widgets and the checkbox not being visible, we just need to add a custom CSS in the widgets. Let me show you how:

1. First, copy this code:

.checklist label.checkbox .before {

  border: 2px solid #000 !important;

}

.checklist label {

font-size: 12px

}

.items-left { 

font-size: 9px;

}

2. Open your form in Form Builder, scroll down, and select the Gift Registry widget.

3. Click on the Wand icon on the right side of the widget to open Widget Settings.

4. Under the Custom CSS tab, paste the code into the CSS Code box.

5. Repeat the steps, but now select the Ticket Purchases widget and paste the same code.

As for your question about selecting more than 1 workshop, I checked your form and it can select multiple workshops. Check the screenshot below :

As for the calculation values. You need to add a Form calculation widget for each workshop choice and setup conditions so that it can calculate the total amount per selection. Let me show you how:

Add the Form Calculation Wizard

1. While in Form Builder, click on the Add Form Element menu on the left side of the page.
2. Under the Widget tab, scroll down the list and choose the Form Calculation.
3. Now, just drag and drop it to your form.

Setup the condition

1. In Form Builder, in the orange navigation bar at the top of the page, click on Settings.
2. Click on Conditions in the menu on the left side of the page.
3. Then, click on the Add Condition, then choose Update/Calculate Field.
4. Setup the condition based on the screenshot below:

You need to set up each workshop following the condition format above. Once you have the 13 Calculation Form Widgets set up. you can just setup the total amount by adding all 13 form Calculation Fields. Check the screenshot below:

1. While in Form builder, cLick on the Form Calculation Widget that is labeled as total on your form.
2. Click on Widget Settings, then add all the Form Calculation fields.

Give it a try and reach out again if you need any other help.

Thank you Paolo.

However, I am obviously doing something wrong, please take a look: https://www.jotform.com/build/242204564044145

In the Ticket Purchase widget, it will only add the cost for the first selected workshop. Subsequent choices of workshops change the cost to 0

For the Workshop selections, I didn't mean that the user could select multiple workshops from the list, but rather they could request more than one place in a single workshop - in case they are registering for themselves and a friend.

Thank you.

Lise

Hi Lise,

You're actually doing great. Three things that you need to do so that it will calculate the total:

1. Go to your Conditions, remove the "+" sign on the Calculate Field Value.

2. For the total amount, click on the Form Calculation Widget and click on Widget Settings. Add a "+" sign after each field that you added.

3. In your Updated form, you used a Multiple Choice Element and Hid your widgets. If that is the case you need to update the Conditions and change the If condition. Make sure to replace it with Please check each Workshop you are signing up for. Check the screencast below:

See the results below.

Reach out again if you have any other questions.

Hello Paolo, sorry to ask again, but I'm still having problems.

In the form I'm working on: https://www.jotform.com/build/242204564044145 it's the Multiple Choice that is hidden, and the Ticket Purchase widget that's visible and active.

I've added the CSS code you sent, and made the corrections to the Form Calculation fields - that does the trick of correcting the font size and displaying check boxes, but is still zeroing out the second and subsequent workshop choices.

Since I am in fact using the Ticket Purchase widget for workshop choices, I have left the conditions as they were - checking the 'Please check your Workshop choice(s)' and populating the Form Calculation widgets with the corresponding fees.

I think I'm going crazy ! 😬🤪

Hi Lise,

Let me look into it and get back to you with a solution.

Thanks for your patience, we appreciate it.

Hi Lise,

I noticed that in your Update/Calculated condition, you selected "Is Equal To", once you change it with "Contains" the issue is fixed. Let me show you how to do it:

1. Go to your Conditions, copy your Value, change the Is Equal To to Contains and paste the previous field value like shown in the screencast.

2. Click on Save. Follow these steps for all the Condition areas.

Here's how it looks:

Give it a try and let us know how it goes.

Thank you Paolo.

I have done as you suggested above, but I'm not sure you're looking at the correct form. It should be: https://www.jotform.com/build/242204564044145

In this form the Ticket Purchase widget is enabled and the Multiple Choice element is hidden, and so the conditions should - I believe - be using the values in the Ticket Purchase widget 'Please check your Workshop Choice(s)' to populate the nine Form Calculation widget fields.

Although I made the + sign changes, it is still zeroing out when a second workshop is selected.

I'm sorry to be a pain, but I'm stumped as to where I'm going wrong!

Lise

Cecilia - that worked! You and Paolo are the best.

Thank you!!! That is the weirdest thing, although I suppose 'contains' is less stringent a test than 'is equal to'.

Once again, Jotform's customer service beats everything else, anywhere. Patience, willingness to stick with it until there's a workable solution - I bow to your excellent service.

I wish I could leave a review somewhere, but the review sites only let corporate folks do that.

Lise