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

    PDF form different then the actual created form

    Asked by Carpediemstudios on April 21, 2017 at 02:01 AM

    I have create a form and I have been able to add a PDF with my submission to my clients.

    When i ran a test - I noticed that the PDF attachment is completely different then the actual form.

    I went through alot of your forums but i still cannot figure this out.

    also - Once I finally get my PDF looking the same I would like it to have the proper breaks and spacing to look like the form it self.

    Note: I have attached the form that it should look like.

    Can you help please? :(

    thank you!

    Page URL:
    https://form.jotform.ca/70957509324260

    Screenshot
  • Profile Image
    JotForm Support

    Answered by Charlie on April 21, 2017 at 04:42 AM

    Hi,

    Please note the the PDF submissions will have a different layout and format. If you want to print the live form with the submission data on it, you could try following this guide: https://www.jotform.com/help/335-How-to-Print-the-Form-with-the-Users-Data

    I did check your form and I see that you have indeed created a customize PDF, to learn more about this feature, please also do check this guide: https://www.jotform.com/help/384-How-to-Customize-PDF-Submissions-Report

    However, I do see that some of the changes in your PDF design is different from the downloaded PDF submission. Here are the things I noticed that you also mentioned: 

    1. Image is not properly aligned:

    In the PDF Designer, the image is centered. 

     

    But when you download a submission, it is aligned to the left.

     

    2. Page breaks. 

    In the PDF Designer, the text is pushed to the next page, although, it is better if it is not being cut off in this view. I suggest adjusting it further. 

     

    When you download a PDF submission, part of the text is in page 1. 

     

    If you could provide us more inconsistencies, please do share it with us so that we can forward this to our developers. If you will be attaching images, please directly do that by opening this thread on a new window/tab and use the reply textarea, here's the link to this thread: https://www.jotform.com/answers/1125139

    We'll wait for your response. 

  • Profile Image

    Answered by Carpediemstudios on April 21, 2017 at 05:38 AM

    I Adjusted the PDF under "submissions" and "customize PDF" - I then went and adjusted the spacing and it looks better - I then saved it.

     





    Now when I go back into "PREVIEW FORM" - I fill out my form and press "PRINT FORM" -
    Then "OPEN PDF IN PREVIEW".
    My PDF format is still incorrect regarding".

    The following items are incorrect:

    1) it went from 3 pages to 5 pages


    2) Page Break Between 2-3 are wrong


     
    3) Page Break in page 4-5 is wrong
     
     
     
     

    4)  Top of pages shows  "Thank You         https://form.jotform.ca/70957509324260?preview=true
     
     
     
     
    Here is the link to my form:  https://form.jotform.ca/70957509324260

     

     

     

  • Profile Image

    Answered by Sven on April 21, 2017 at 07:50 AM

    Please note that this is a browser issue, to overcome this, we can force the browser to print a page break where we want,  add a TEXT element with the following HTML code inside right before where you want the page break: 

    <div class="pagebreak"></div>

    You have one already added in your form, before the wedding collapse, please see below:

     

    Please repeat the same anywhere you want the page to break. 


    After that, inject the following CSS in your form:

    @media print {

       .pagebreak {page-break-after: always;}

    }

    This will force the form to print the content after that text element into a new page, and it will fix the printing issue. 

    Here's how to inject custom CSS into your form:

    How-to-Inject-Custom-CSS-Codes

     


    4)  Top of pages shows  "Thank You         https://form.jotform.ca/70957509324260?preview=true

    This is also a browser thing, you can remove it by doing the following:

    1. From the print page, click on More settings:

     

    2. In Options, uncheck Headers and footers:

     

    I hope this solves your issue, please get back to us if you need any further help.

     

    Thank you.

     

  • Profile Image

    Answered by Carpediemstudios on April 21, 2017 at 11:46 AM

    I understand what you saying thank you for that. But i have already tried these steps.

    I added a TEXT then a HTML code into the SOURCE CODE area (correct?)

    I then added a CSS into the appropriate location.

    But, what this does is puts my page breaks in the wrong locations. and also adds an additional
    whole blank page.

     

    2) also - can the AGREEMENT DETAILS page be in one single page when printing? (I have added a page break before and after)
    As of right now - it splits into two pages, which is okay if not fixable, but then can i space the information properly so it does not cut the information?

     

    The last page/tab is the SIGNATURES.
    This is perfect how it turned out!

  • Profile Image
    JotForm Support

    Answered by david on April 21, 2017 at 01:32 PM

    The extra page seems to be added due to the email field seemingly being on the second page.  When I removed the page break after the email field, the empty page was removed and Wedding Information was moved up to the second page.

    There looks to be far too much text in the agreement details to fit on one page without making the text very small.  I separated the text into two fields then I added a "Spacer" widget and increased the space until the text was on the correct pages:

    Those updates should allow for printing directly from the form with the formatting you are looking for.

  • Profile Image

    Answered by Carpediemstudios on April 21, 2017 at 06:36 PM

    So I end up removing all the page breaks and just added spacers and adjusted height to move things around.

    The only thing I dont like now is that all the fonts and spacing is too large for my liking,

    To prints its 5 pages when I know it can be done in 3

     

  • Profile Image
    JotForm Support

    Answered by liyam on April 22, 2017 at 04:44 AM

    You can adjust the text of labels and answers on your custom PDF by going to the settings menu

    Next, the preferences window will appear and you should be able to resize the text of the PDF in as a whole.

     

    You can also reduce the text size of the fields and labels by clicking the wrench icon and pressing A- to reduce the size of the text.

    If you need assistance on this please let us know.

    Thanks.