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

    Form Designer Preview Not Accurate

    Asked by emlogodesign on October 18, 2014 at 04:33 PM

    Here is my form ... this preview is how I want it to look http://form.jotform.us/form/42689231036152

     

    When I put it on my website it spaces everything out and adds more space.. www.emdesignia.com Please help!

    Page URL:
    http://emdesignia.com

    preview form editor form designer designer preview form preview
  • Profile Image
    JotForm Support

    Answered by Jan on October 18, 2014 at 10:55 PM

    Hi emlogodesign,

    I can see that you used the new Form Designer. Thank you for trying our new tool. Sorry if you are having issues with it. In the Form Designer if you click "Preview Form" it will go to the section where you can preview the layout on different devices.

    This is what the original form looks like on desktop and tablet screen.

    I tried cloning your form and try to check it on Form Designer. On preview mode, If you click on mobile phone portrait or landscape, you can see the lines. Although it shows fine in desktop and tablet screens. Please check the screenshot below.

    On your Wix website, it shows that you embed the form on right side.

    First, try re-embedding the form using this guide.

    Adding a Form to Wix Site (http://www.jotform.com/help/70-Adding-a-form-to-Wix-Site)

     

    If the issue is still the same then please try "Adding" these custom CSS code.

    /* Custom CSS */

    @media only screen and (max-width: 768px) {

    * {color: #ffffff !important;}

    .form-line {border: 0px !important;}

    .form-submit-button-light {color: #7c868d !important; border-radius: .3em !important; text-shadow: 1px 1px 0px #ffffff !important; border: 1px solid #dfdfdf !important; -moz-box-shadow: inset 0 1px 0 0 #ffffff, 0 1px 1px 0 rgba(0, 0, 0, 0.40); -webkit-box-shadow: inset 0 1px 0 0 #ffffff, 0 1px 1px 0 rgba(0, 0, 0, 0.40); box-shadow: inset 0 1px 0 0 #ffffff, 0 1px 1px 0 rgba(0, 0, 0, 0.40); background: #eaeaea !important; background: -moz-linear-gradient(top, #fafafa 0%, #eaeaea 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fafafa), color-stop(100%,#eaeaea)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#eaeaea',GradientType=0 ); background: linear-gradient(top, #fafafa 0%, #eaeaea 100%);}

    }

    @media screen and (max-width: 768px) {

    .form-line { padding: 0px 10px !important; }

    }

    Here's a guide on How to Inject Custom CSS.

     

    Hope this helps, if not please let us know.

    Thank you!

     

  • Profile Image

    Answered by emlogodesign on October 20, 2014 at 01:41 PM

    Neither of these options work. Also the link to the directions for wix html
    is broken. It's even worse now than it was before. Please help!!

  • Profile Image
    JotForm Support

    Answered by Mike_T on October 20, 2014 at 02:51 PM

    The form looks different on your web page due to enabled Mobile theme.

    Please enable a Nova Theme or a SuperNova Theme on your form, then re-check the form on your web site.

    Thank you.

  • Profile Image

    Answered by emlogodesign on October 20, 2014 at 10:41 PM
    This helped a little, but I do not want the labels showing. I want the form
    to be very compact. The beta designer allows me to do this...but it doesn't
    seem to be working accurately.
    --
    *Emily Kucera*
    *Graphic Designer*
    563.581.0019
    emdesignia@gmail.com
    emdesignia.com

    Share your positive experience by writing a review!

    ...
  • Profile Image
    JotForm Support

    Answered by Welvin on October 21, 2014 at 07:39 AM

    Hi Emily,

    You can again hide the label using the form designer. I've fixed it for you. Please kindly check now.

    Thank you!

  • Profile Image

    Answered by emlogodesign on October 21, 2014 at 09:41 AM
    Okay, we're still moving forward however the form is still very glitchy.
    I've published this version of the form on my site, however:
    1. Once I submitted the form once on my website it disappeared from the site
    2. When I reloaded the page to see if the form would come back it did come
    back but 1/2 of the submit button was missing although the whole button was
    there previously.
    3. I never received the autoresponder only the notification. (I double
    checked my email and it is correct)
    ...
  • Profile Image
    JotForm Support

    Answered by Welvin on October 21, 2014 at 10:43 AM

    1. Because you have the form redirect to: http://www.emdesignia.com/#!5-cost-saving-ideas/c1ofk which is an empty page - no form is there.

    2. Reloading the form doesn't give me a problem here, I'm using Chrome 38 and Firefox 33 in Windows 7 PC. But considering you're using Wix website which is flash based CMS, Framed contents are usually loaded right after the whole website elements.

    3. I have move the autoresponder issue to a new thread, please kindly check it here: http://www.jotform.com/answers/446653.

    Thank you!