-
CharlesobiAsked on August 11, 2017 at 9:39 PM
I want to add a title to "Preview Before Submit" Widget before the preview.
Something that goes like this;
Thanks for your time; please go through your answers before submitting
_______________________________________
_______________________________
_____________________________________
______________________
(Where the lines are the review of the answers)
Please, how do I go about this? Thanks, hoping for your helpful reply
-
John_BensonReplied on August 11, 2017 at 10:40 PM
To add a text in the Preview Before Submit widget page, please inject this Custom CSS Code to your form:
div#checkSubmission:before {
Content: "Thanks for your time. Please go through your answers before submitting.";
}
To add a Custom CSS Code to your form, please follow this guide: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes
You can test my demo form on this link: https://form.jotform.com/72228142505954
Here's the result:
I hope this helps. If you have questions, please contact us again.
-
CharlesobiReplied on August 12, 2017 at 8:27 AM
Ok, thanks, that was helpful.
But I found out that the title is too close to the top and the font is too small.
1. How can I add Margin to the top before "Thanks for your time. Please go through your answers before submitting."?
2. Also, how can I increase the font size too?
Thanks for your assistance so far.
-
CharlesobiReplied on August 12, 2017 at 8:53 AM
In addition to that, I just found out that the write up appears at the footer of each of the form's page before the page it's meant to appear as can be seen in the attached picture.
How Can this be rectified?
Thanks.
-
BJoannaReplied on August 12, 2017 at 9:58 AM
I was able to see mentioned issue. The custom text is shown at the bottom of the each page.
Instead of adding the Custom CSS code for the 'Thank you' message, I would suggest you to add a Text field at the top of your form and add your 'Thank you' message there.
Then hide the Text field with this CSS code:
#text_59 {
display : none;
}
Here is my demo form: https://form.jotformpro.com/72234427449964
Feel free to test it and clone it.
Hope this meet what you are looking for.
-
CharlesobiReplied on August 13, 2017 at 10:27 PM
Ok, thanks. BJoanna that was helpful. I have done that.
-
Ashwin JotForm SupportReplied on August 14, 2017 at 2:02 AM
Hello Charlesobi,
1. How can I add Margin to the top before "Thanks for your time. Please go through your answers before submitting."?
Please inject the following custom css code to add top margin before the preview message:
.value.no-label {
margin-top: 35px !important;
}
2. Also, how can I increase the font size too?
Please inject the following custom css code to increase the font size:
.value.no-label span {
font-size: 20px !important;
}
Hope this helps.
Do get back to us if you have any questions.
Thank you!