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 align my form buttons and use images for the buttons background

    Asked by devignedenis on May 26, 2014 at 03:55 PM

    I am having trouble lining up my submit buttons so they look great. 

    We would like the EXIT and the ENTER buttons side by side.

    Here is the enter button:

    Here is the Exit button:

     

    Please advise.

     

    :)  Thanks so much!

    thanks side by side and
  • Profile Image

    Answered by EliezerN on May 26, 2014 at 05:06 PM

    Hi,

    I think this is the form you are talking about: http://www.jotform.ca/form/41320459069252

    Is this what you are looking for? http://form.jotform.co/form/41456218277862

    If so, Please follow these steps to get your form buttons working properly:

    1. Copy the next html code and paste inside your Text of your Enter field:

    <p><a target="_blank" href="http://shout96.wix.com/sop3#!home/mainPage" ><img src="//oi61.tinypic.com/2pt9s09.jpg" alt="" /></a></p>

    Please note that in my form I changed the href value of the enter button to https://www.jotform.com.

    2. Then, inject this CSS code to your form: 

    #text_84, #cid_84

    {

    width:138px !important;

    height:48px !important;

    margin-top:5px !important;

    }

    #id_84

    {

    position:absolute !important;

    margin-top:-5px !important;

    width:138px !important;

    }

    .form-buttons-wrapper

    {

    margin-left:150px!important;

    margin-top:19px !important;

    }

    Here is how to inject CSS codes to forms: How to inject custom CSS codes

     

    Then your form will look this way:

    Please inform us if you need with this query.

    Thanks

  • Profile Image

    Answered by devignedenis on May 30, 2014 at 10:06 AM

    Yikes, It did not come out right for me...

    http://www.jotform.ca/form/41320459069252

     

    Please advise !  thank so very mcuh!

  • Profile Image

    Answered by Carina on May 30, 2014 at 11:42 AM

    Upon inspecting your form I could not find the html code suggested by my colleague inside the Text field:

    <p><a target="_blank" href="http://shout96.wix.com/sop3#!home/mainPage" ><img src="//oi61.tinypic.com/2pt9s09.jpg" alt="" /></a></p>

     

    I also added the condition that will show the enter button only if option yes is chosen:

    If you wish you can clone this form:

    http://form.jotformpro.com/form/41495043040950?

    Let us know if the problem persists.

    Thank you

  • Profile Image

    Answered by devignedenis on May 30, 2014 at 11:41 PM

    The big red buttons ENTER and EXIT are missing on the form...

    on the clone....  Like below

    Please advise

  • Profile Image
    JotForm Support

    Answered by TitusN on May 31, 2014 at 09:40 AM

    Hello,

    We sincerely apologize - but that text will get cleared for security reasons.

    Why not use a second Submit button - change the Button Image, and then program the form to send it to the URL of your choosing?

    I've prepared a demo here - please examine it and advice.

    Thanks.