1. Home
  2. Contact Form Manager
  3. FAQ
  4. How can I change the design of Submit button?

How can I change the design of Submit button?

You can place a css class in the form content at the beginning (in the HTML section) like given below

<style type="text/css">
.submit_button
{
background-color:red;
color:white;
}
</style>

submit style 1

And then while configuring the form element ‘submit’ give the ‘Style Class Name’ as submit_button

submit style 2

If you want a different style create such a css class.

In some cases, your default style may override the custom style. In such a condition, please use the code as

<style type="text/css">
.submit_button
{
background-color:red;
color:white !important;
}
</style>

Due to some features of wordpress, the style tag entered in the form section will disappear when saving it. In such a situation, you can add the style in the style.css (default style) file of wordpress installation.

You can also define the style using the id of the form element. Consider if the the code of the submit button is [submit-10].

Then you can use the following code in the contact form.

<style>#submit_10 {background-color:red; color:white; }</style>

submit style 3

In this case, you donot want to add the style class in the form element as in the first method.

Note: While copying the style class code from this site, please change the quotes (“”) of the code. Due to the theme in this site, a different quote is displayed in the code.

Was this article helpful to you? Yes No