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 to change submit button color in a theme?

    Asked by NHEMICE12 on December 15, 2016 at 02:48 AM

    When I adapt the form with a theme, is it possible to change manually for the submit button? I wanted to change to the Leather Black button instead

    Theme - Nature - Bleak Desert

     

    Page URL:
    https://form.jotform.me/NHEMICE12/USANAdubai2017

  • Profile Image
    JotForm Support

    Answered by emily on December 15, 2016 at 03:19 AM

    Hi,

    Thank you for contacting us.

    Please give me some time for making further inspections. I will notify you when I find a solution.

     

  • Profile Image
    JotForm Support

    Answered by emily on December 15, 2016 at 05:36 AM

     

    Hi again, 

    Since you are using a theme for your form, it is affecting the style of the submit button. To change the style of the button, kindly add the custom CSS code below. Please remove any CSS codes you have added to your form before.

     

    #input_2.form-submit-button{

       width: auto;

        height: auto;

        border-radius: inherit !important;

        padding: 10px 30px !important;

        cursor: pointer;

        -moz-border-radius: .5em;

        -webkit-border-radius: .5em;

        border-radius: .5em;

        padding: 10px 18px;

        color: #fff !important;

        font-family: Arial,Helvetica,sans-serif;

        font-size: 14px;

        font-weight: bold;

        text-shadow: 0px 2px 0px #000;

        border: 2px dashed #fff !important;

        -moz-box-shadow: 0 0 0 4px #262626, 0 4px 0 4px #000000, 0 6px 3px 4px rgba(0, 0, 0, 0.40) !important;

        -webkit-box-shadow: 0 0 0 4px #262626, 0 4px 0 4px #000000, 0 6px 3px 4px rgba(0, 0, 0, 0.40) !important;

        box-shadow: 0 0 0 4px #262626, 0 4px 0 4px #000000, 0 6px 3px 4px rgba(0,0,0,0.40) !important;

        background: #4d4d4d;

        background-image: url(/images/leather.png ) !important;

        border-radius: 10px !important;

    }

    Here is the user guide on injecting custom CSS codes.

    https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

     

    Please let us know if you encounter any problem.

    Thank you.