Urgent for Site Due Today: Forms Breaking Pages in Google Chrome

  • Profile Image
    3dcleaning
    Asked on April 19, 2012 at 09:45 AM

    Hi,
    I've placed three Jotforms on a site. Each form is on a separate page.

    In Google Chrome, there is a huge amount of white space beneath the forms.

    Here are the links:

    Estimate Page

    Schedule Page

    Contact Page

    This has never happened before with any other sites I've built using Jotform.

    This is urgent for a site to be delivered today.

    Thanks!


  • Profile Image
    jeanettebmz
    Answered on April 19, 2012 at 02:20 PM

    @3dcleaning

    Thank you for using our product.

    I have checked the iframe code and you would need to reduce the height of the frame in order to reduce the space seen in Google

    Also,  enable the scrolling  property to "yes" if you think it is needed

     

    Hope this helps

    Should you need further assistance, let us know

    Jeanette

  • Profile Image
    3dcleaning
    Answered on April 19, 2012 at 04:29 PM

    Hi Jeanette,

    Thanks so much for seeing this. It's odd, because there isn't any iframe code in the source HTML. I just checked the file.

    Is that source code being added in by Jotform? If so, where do I update that?

    Thanks again!

  • Profile Image
    jeanettebmz
    Answered on April 19, 2012 at 05:37 PM

    That code is part of your page, if you do a right click on Google Chrome , and then inspect element, you will see the code I am talking about.

    You have embed our form using the javascript method

    But  that is an iFrame HTML tag that was added after the jotform script

    However you can easily use the option in Chrome to edit the height directly.

    By the way I see that the contact us form height has already been adjusted to 425 px and it looks ok in Chrome, try to do the same with the others

    My other suggestion would be to  Embed the iFrame code from our form builder , and delete the the iFrame Tags I see on  the contact us page.

    Jeanette

  • Profile Image
    3dcleaning
    Answered on April 20, 2012 at 01:55 PM

    Thanks so much for the help, and please forgive me, but I am still a bit confused

    If I update these heights directly via the 'Edit HTML' in Google Chrome's browser, will the forms show up correctly for everyone that views them in Google Chrome? Or, just for me?

    Also, why is this height issue happening? It's never happened with any other Jotform forms I've built or managed.

    Thanks!

  • Profile Image
    pinoytech
    Answered on April 20, 2012 at 02:08 PM

    Hi,

    Even though you will update your form codes via 'Edit HTML in Google Chrome', it won't effect. You should update the codes directly into your website, in order for the changes effect as well as the updated form code.

    Thank you!

  • Profile Image
    3dcleaning
    Answered on April 20, 2012 at 02:41 PM

    Thanks again, 

    But, I'm still missing something. I've checked my actual source files, and the iframe code is not anywhere to be found.

    All that's in the file is the Jotform embed script code: <script type="text/javascript" src="//form.jotform.us/jsform/20742174693153"></script>

    Where is the iframe code being seen in Google Chrome originating from?

    Thanks again!

  • Profile Image
    jeanettebmz
    Answered on April 20, 2012 at 03:11 PM

    Sorry for the delay to come back to you

    I have found that the reason of the issue is that you don't have the correct Embedded code.

    For Example, the current jotform script code embedded into your Schedule Service page

    is calling the iFrame function. That is why you cannot find that iFrame code in your HTML , because it is in that jotform script.

     

    Please embed either this Script (for the Schedule service form)

    <script type="text/javascript" src="//yang.jotform.com/jsform/20742174693153"></script>

    or this iFrame code

    <iframe allowtransparency="true" src="//yang.jotform.com/form/20742174693153" frameborder="0" style="width:100%; height:2090px; border:none;" scrolling="no">
    </iframe>

     (you can adjust the height from there, though I don't think it would be necessary)

    Please follow this guide in order to find out how to embed correctly a Jotform form into a website, to change the other pages, just replace the current code.

    You can choose either Embed method or iFrame method

    Hope this finally sorts out the issue

    We are always happy to assist, feel free to come back with more questions if you need it

    Jeanette

  • Profile Image
    3dcleaning
    Answered on April 26, 2012 at 12:05 PM

    Hi Jeanette,

    Unfortunately, it's still not working.

    I've tried both methods listed above and it's still not working correctly. I also tried copying and pasting the full form source code into the pages, and that did not work, either.

    This is odd, b/c I've never had this issue with any of the forms on this site before.

    Is there a number where I can call someone?

    Thanks!

  • Profile Image
    3dcleaning
    Answered on April 26, 2012 at 12:40 PM

    Ok, tried the Dreamweaver method, and it worked. It lost some of the styling, but works.

    I should be good to go, but will reach back out if there are any other questions.

    Thanks again!

  • Profile Image
    jeanettebmz
    Answered on April 26, 2012 at 12:42 PM

    It is great to know that finally  you sorted out the issue

    Feel free to come back for further help. We are always glad to assist

     

    Jeanette

    P.S  we don't have phone support, sorry.