How to change the heading color with Jotform 4

  • adhsband
    Asked on March 18, 2017 at 11:54 AM

    In Jotform 3, it used to be I could add <font color="orange"> </font> around the heading text to change the color. At some point that quit working with an existing form... The text shows orange when in the form builder but black during preview or publish. It works for a minute when I do it in Jotform 4, but then it stops.

    This really needs to be more intuitive people... Injecting CSS is for software developers not software end users.

    Please give me instructions on how to make both my heading and subheading orange using Jotform 4.

    Thanks.

  • Kevin Support Team Lead
    Replied on March 18, 2017 at 11:27 PM

    You could change the heading color by opening the designer tool, scrolling down and clicking on the advanced designer tool: 

    How to change the heading color with Jotform 4 Image 1 Screenshot 40

    How to change the heading color with Jotform 4 Image 2 Screenshot 51

    Once you got into the advanced designer you need to click on the heading text and change the font color from the header style options:

    How to change the heading color with Jotform 4 Image 3 Screenshot 62

    Additionally if you need to change the color injecting some CSS code then you could simply inject this code: 

    .form-header-group .form-header{

        color: orange;

    }

    This guide will help you to inject it: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

    Hope this helps. 

  • seth
    Replied on March 20, 2017 at 7:32 AM

    Hello,

    I checked your form and see that you have changed the header color from Advanced Designer but this change is not reflected on the builder and on the published version of your form.

    Advanced Designer:

    How to change the heading color with Jotform 4 Image 1 Screenshot 30

     

    Builder:How to change the heading color with Jotform 4 Image 2 Screenshot 41

    I am escalating the issue to our developers. They will fix your form.

    We will notify you via this thread.

    Thank you.

  • adhsband
    Replied on March 20, 2017 at 9:51 PM

    It's fine, I injected CSS and it works fine, don't sweat it. Thanks.

  • berkay Director of Engineering, Frontend
    Replied on March 21, 2017 at 2:38 AM

    Hi,

    We apologize for the trouble that caused to you. We have found the related error, and I have fixed it.

    Thank you for your patience and understanding.

    Regards,

    Berkay