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.
You can use Inject Custom CSS feature of JotForm to change the background of the heading.
Here's how to add your custom css:
1. Open your form in JotForm
2. Click on 'Setup & Embed'
3. Choose 'Preferences'
4. Select 'Form Styles' and in the Inject Custom CSS
add the following code:
background:none repeat scroll 0 0 #000000;
Let us know if you need anythin else.
I have a question, I have changed the background color of the form but the background of heading remains the same. What's the use of changing the background color without changing the background of heading? It looks so odd!
In not all situations would one necessarily want to use the same color for the two elements. In the background declaration of the CSS rule provided by my colleague, replacing #000000 with transparent should effect the change you seek. Assuming you also wish to remove the heading's bottom border and the sub heading's top border, the total CSS injected should be as follows:
background: transparent none repeat scroll 0 0;
Tools like Firebug are quite useful when it comes to determining what selector should be used in each rule.
For information on the shorthand background declaration, please see the section headed "Backgrounds" in this article.
Incidentally, those light gray sub labels of the Phone Number field are hard to see against the form's orange background. If you need help with styling them, please open a new thread.
I have think you should add this to the tool bar.
I found that there are too much blank space on both sides of the form, how to solve this? I have make the width smaller but it doesn't work.
Yes, I quite agree that a button should be included in the toolbar to more easily change those heading elements. I believe such a request has already been forwarded to our developers but I'll have to check.
As to the blank space on the form's sides, please open a new thread on the topic and we'll see how best we can assist you.
It's been almost a year and there is still no easy way to change header color?
Unfortunately no updates yet and still injecting custom CSS is the way to modify the color there is no other way as of the moment.