Accepting General conditions & Privacy Rules

Hello Support Team,

I want to know how I can achieve the following thing:
I want that the customer accept the genral terms of the company and the privacy rules. He has to check both items before being able to transmit the form.

The second question is: I want to add a link to the general terms of the company and a link to the privacy rules which are opened in another window when the customer click on it to read them before approving them in the form.

I hope that you can help me with these issues
Kind regards.
Daniel

Hi Daniel,

You can use the Terms and Conditions widget to link your terms to the form:
https://www.jotform.com/widgets/terms-and-condition

Then you can make the field required, to make sure that the user has checked the field before proceeding:
How-to-set-a-field-as-required-or-non-required

Let us know if you have any further questions, and we are happy to help.

Hei Laura,

thanks for your help. Now I'm struggling with a second problem: how can I adjust the color of the text and the color from the link text because it is not visible on my formular. I was able to do it by adjusting the css code on the other fields but with this one it seems not to be possible. Can you look to it. Thanks in advance.

Hi,

To change the color of the hyperlink in you r form you can use this CSS code:

a { 

color: orange !important;

text-decoration: underline !important;

} 

Also, to change the color of the text you have to change it from the default to light color in the Terms and Conditions widgets. Here is the GIF below:

Feel free to ask for further assistance.

Many many thyanks Zahra. This was very helpful. A last question: is there a way to align the text from the second an third line with the first line. I want the text is aligned with the "v" from the first line.
Kind regards.
Daniel

Hello Daniel,

Please inject the CSS code below:

#cid_36, #cid_35 {

padding: 0 29px !important;

}

Result:

Let us know if you need further assistance.

Best regards,

Hello Billy,

Sorry, I think I explained it not correctly enough. Here below I made a drawing from what I want to obtain:

I

The screenshot seems to be broken. Are you referring to something like this though?

If so, please refer to the screencast below:

We'll be waiting for your response.

Hello Billy,

I put more information on my drawing to explain you what I want:

The Easiest Online Form Builder (jotform.com)

I have 2 remaining problems:

Please explain me alos where I have to place the css code you will send me. Thanks in advance.

Hi,

Please allow me some time to check on this, and I will get back to you as soon as I have more information.

Thank you!

Hi,

For the first question, please try adding this custom CSS code to the widget's custom CSS section:

div#cid_35 {

  margin-bottom: -30px !important;

}

For the second question, please try adding this custom CSS code to the Form Designer's custom CSS section:

Guide: https://www.jotform.com/help/117-how-to-inject-custom-css-codes

div#cid_35 {

  margin-bottom: -30px !important;

}

Please give it a try and let us know how it goes.

Hello Jovanne, the second issue is ok now. The strange thing is , that I see only the result in the preview mode but in the build mode I don't see the difference.

The first issue isn't solved. May I ask you to do the modification from your side, so that I can see that it works. You can modify my original form. I try to unerstand how it works.

https://form.jotform.com/212884755280362

Thanks in advance

Hello Support Team,

the first issue is that in the last condition the text is not aligned. The second and third row text is more to the left then the first line. I want to have al the text aligned like here below: you may adjust my formular directly. I will try to understand what you did

Hi there,

Could you please try to inject the following code into the widget:

label{

position: absolute;

     }

Please give it a try and let us know how it goes.

Hello Mianala,

thanks for your advise. The text is now aligned to the left like I like it but I have still 2 problems:

Problem 1: 1 line is missing. I have normally 3 lines. The text is now not completely visible (Image 1)

Problem 2: why is the visualisation from my form different in buil mode and preview mode (Image 2).
is there a solution for it. The spacing in the preview mode is correct, in the build mode wrong

Hi,

Please attempt adding the following CSS code into your widget instead:

#main div{

  display: flex !important;

}

#userInput {

margin-top: 3px;

}

Regarding the difference, it's because the builder doesn't always inperpret CSS code similar to the browser in the live form.

Please let us know if you require any further assistance.

Hello Basil,

thanks for your reply. May I ask you to look to the result after having inserted your css code. I removed this code again. May I ask you to adapt our form directly from your side so that you can see that the result is ok or make a copy of it when you prefer. I appreciate your help.

The Easiest Online Form Builder (jotform.com)

Allow me to work on your request. I'll reach out again as soon as I have an update.

We appreciate your patience and understanding.

Thanks for patiently waiting.

Please remove all the injected CSS code and insert mine below:

#cid_36 {

height: 90px !important;

}

#cid_36 > div > iframe {

height: 100% !important;

}

Result:

Sample form: https://support.jotform.com/212894202053954/

Let us know if you need further assistance.

Best regards,

Hello Billy,

many many thanks for your assistance. Now it is working like I want to have it. I have no experience with CSS and I think I will take a course because you need it when you want to make perfect forms. The only problem is that I have to find time. A day has only 24 hours.

Hi,

To avoid confusion, I moved your other issue to a new ticket. Please check my reply on this link: https://www.jotform.com/answers/3435645

Thank you!