What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    How can I reset all color formatting on a form (most likely using CSS)?

    Asked by djdemers1 on July 07, 2015 at 04:13 PM

    I recently imported forms from Adobe, and the custom CSS seems to take priority over the JotForm designer. The CSS is very messy, and if I remove all injected CSS, the spacing and margins of the form go crazy.

    I've tried a simple html, body { background: transparent !important } fix which made some progress, but some color formatting seems to be hidden deep in the code.

    Is there a simple fix to the code that would make all backgrounds white, all text black, and allow for future formatting to be controlled by the designer?

    Page URL:
    http://form.jotformpro.com/form/51875908482973

    JotForm hidden Injected CSS
  • Profile Image
    JotForm Support

    Answered by BDAVID on July 07, 2015 at 05:44 PM

    I doubt there is a simple way to do this, basically you have to copy the whole injected CSS code, paste it in a text editor, look for the "color" attributes, and delete them, just leave the CSS code that adjust the padding, margins, position etc.

    I have actually started doing it on this form: http://form.jotformpro.com/form/51876971944977?

    Also, the "hidden formatting" it's actually the style attributes located on each of the HTML fields:

    I have remove the color, so the forms looks now like this("all backgrounds white, all text black"):

     

    You may clone my form as explained on this guide: http://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL

    You might have to ever check deeper to remove certain style attributes, hope this helps.

    (Suggestion: do not touch the original imported form, make clones and work on them.)

  • Profile Image

    Answered by djdemers1 on July 08, 2015 at 11:11 AM

    Ha, I hadn't thought to check the style attributes... Thanks very much, very impressive service here at JotForm! Cheers,

    Dan

  • Profile Image

    Answered by djdemers1 on July 08, 2015 at 11:32 AM

    As a follow-up... I'm realizing that there are hundreds of these style attributes and it's not practical to change them one by one. Thanks Adobe, ha... Ideally I could access the full HTML code and do a Replace All.

    I've seen threads on how to download the code (Embed -> Source), but is it possible to upload the new HTML code somewhere?

  • Profile Image
    JotForm Support

    Answered by Welvin on July 08, 2015 at 01:00 PM

    No, you cannot import back the form source codes into the form builder. That means you are going to customize the form outside the form builder.

    I know it's a time-consuming process, but you have to go through each field and remove the inline styles.

    For the current form, I've made the changes for you. Here's the link: http://www.jotformpro.com/form/51885152817967.  You should now able to override the styles using the form designer.

    Thanks