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 display my form using a Popup?

    Asked by jpehrler on March 14, 2016 at 02:46 PM

    Can you tell me how click a button on my site and have my form pop-up?

     

    Thanks :)

     

    Page URL:
    http://milfordnow.com/contact-us/

    site thanks and click
  • Profile Image
    JotForm Support

    Answered by Kiran on March 14, 2016 at 03:46 PM

    I understand that you want to embed your JotForm on webpage so that the form opens in a popup. Please follow the steps below:

    1. Click on Publish icon on your JotForm to open the Publish wizard.

    2. Click on Embed on the wizard and then choose Pop-up from the Embed options

    3. You may copy the code displayed and add it to your webpage so that a link shall be displayed. When the link is clicked, the form should be displaying in a pop-up.

    You may check the Preview from the publish wizard.

    Hope this information helps! Please get back to us if you need any further assistance. We will be happy to help. 

     

  • Profile Image

    Answered by jpehrler on March 14, 2016 at 05:49 PM

    Don't want it displayed as a link.  I want a button, that when clicked, the form opens (pops up).

     

    Thanks.

  • Profile Image
    JotForm Support

    Answered by Kiran on March 14, 2016 at 06:08 PM

    Please try using the following code :

    <a target="_blank" href="javascript:void( window.open( 'https://form.jotform.com/41565471934157', 'blank', 'scrollbars=yes, toolbar=no, width=700, height=500' ) ) "> <button>MN Main Contact Form 1 </button></a>

    You may consider using the Feedback button from the Embed options. 

    Hope this information helps! Please get back to us if you need any further assistance. We will be happy to help. 

  • Profile Image

    Answered by jpehrler on March 15, 2016 at 06:28 AM

    This is getting there, but 3 things:

    1.  When opened, the form is a jammed up on the left, with little padding.

    2.  The form should open centered, right over the button.

    3.  How do I change the look of the button?

  • Profile Image
    JotForm Support

    Answered by mert on March 15, 2016 at 10:00 AM

    To center the pop up window, please add the "left" and "top" variables to the "window.open()", then set them as "600". Please, see it from the below:

     

    <a target="_blank" href="javascript:void( window.open( 'https://form.jotform.com/41565471934157', 'blank', 'scrollbars=yes, toolbar=no, left=600, top=600, width=500, height=500' ) ) "> <button>MN Main Contact Form 1 </button></a>

     

    In addition, you can give style by adding "style=""" inside the <button> tag, then you need to add some CSS rules (showed in green areas) in it as it is seen from the below:

    <a target="_blank" href="javascript:void( window.open( 'https://form.jotform.com/41565471934157', 'blank', 'scrollbars=yes, toolbar=no, left=600, top=500, width=500, height=500' ) ) "> <buttonstyle="background-color:green;border: none; color: white; padding: 15px 32px; text-align: center; display: inline-block; font-size: 16px;">MN Main Contact Form 1 </button></a>

     

    Also, the code above will be the final look of your button code. Below, you can see the result of the styled button:

     

     

    Please, do let us know about the results.

    Regards.