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

    Customize Submit button

    Asked by gaetanlaporte on November 07, 2014 at 08:02 AM

    Hello, i'm not an expert in CSS

    i'm trying to get my form button

    http://awesomescreenshot.com/0c83t1wq84

    http://form.jotformpro.com/form/43024426157954

    like the ones on my theme website

    http://awesomescreenshot.com/0e33t1vo5f

    http://www.monepicierbio.net/nous-joindre

    please could you help me with this

     

    thanks a lot

     

    Page URL:
    http://www.monepicierbio.net/nous-joindre

    form button submit button CSS customize button customize
  • Profile Image

    Answered by Ben on November 07, 2014 at 09:20 AM

    Hi,

    Based on the screenshot that you have added I presume that this is what you would like it to look?

    http://form.jotformpro.com/form/43103714533950

    This is the CSS to do that:

    .form-buttons-wrapper > button.form-submit-button.form-submit-button-simple_green_apple {
        background: none repeat scroll 0 0 #5a8200;
        border: medium none !important;
        border-radius: 2px;
        font-size: 16px;
        font-weight: normal;
        text-transform: uppercase;
        width: 200px;
    }

    If you would also like to change the text displayed you should click on the submit button and then on the Submit Text button in your toolbar.

    You can see here how to Inject Custom CSS Codes and here how to Clone an Existing Form from a URL.

     

    Do let us know if you have any further questions.

    Best Regards,
    Ben
  • Profile Image

    Answered by gaetanlaporte on November 07, 2014 at 09:39 AM

    Hello, thanks for your support!

    yes this is what i need. Its working!

    i copied the code on 2 others forms (inject CSS)

    and it dont worl. I dont understand why

     

    http://form.jotformpro.com/form/43024426157954

    http://form.jotformpro.com/form/42917742252961

  • Profile Image

    Answered by Ben on November 07, 2014 at 10:05 AM

    Hi,

    You are welcome.

    I am glad to hear that that is what you were looking for.

    Now the reason why it did not work on other 2 is because you had different themes on the two new jotforms.

    Simple White on http://form.jotformpro.com/form/43024426157954

    and

    Simple Black on http://form.jotformpro.com/form/42917742252961

    Now this would be the CSS code for them:

    http://form.jotformpro.com/form/43024426157954

    .form-buttons-wrapper > button.form-submit-button.form-submit-button-simple_white {
        background: none repeat scroll 0 0 #5a8200;
        border: medium none !important;
        border-radius: 2px;
        color: white;
        font-size: 16px;
        font-weight: normal;
        text-shadow: none !important;
        text-transform: uppercase;
        width: 200px;
    }

    and for

    http://form.jotformpro.com/form/42917742252961

    .form-buttons-wrapper > button.form-submit-button.form-submit-button-simple_black {
        background: none repeat scroll 0 0 #5a8200;
        border: medium none !important;
        border-radius: 2px;
        color: white;
        font-size: 16px;
        font-weight: normal;
        text-shadow: none !important;
        text-transform: uppercase;
        width: 200px;
    }

    Best Regards,
    Ben

  • Profile Image

    Answered by gaetanlaporte on November 07, 2014 at 10:12 AM

    It worked!

    thanks a lot Ben!

  • Profile Image

    Answered by Ben on November 07, 2014 at 10:24 AM

    Hi,

    You are welcome.

    Do let us know if you have any further questions and we would be happy to help.

    Best Regards,
    Ben