Why cannot I not embed a form into my Zenfolio site?

  • katischwiegerphotography
    Asked on November 27, 2016 at 8:12 PM

    I have never had a problem before. I have embedded 4 other forms and now I'm embedding another and it will not work.

  • BJoanna
    Replied on November 27, 2016 at 10:50 PM

    I have inspected website you provided and I found four embedded forms on four webpages. Three of them are shown correctly and the one this page http://www.katischwiegerphotography.com/wedding-questionnaire is not displayed. Is that the page you are having issues with? 

    Form that is embedded on mentioned page is not shown, because it is deleted. Name of the form is [Imported Form] Wedding Questionnaire. I have found mentioned form inside of Trash folder on your account. You can restore your form form Trash folder, by selecting your form and clicking on Restore button. 

    Why cannot I not embed a form into my Zenfolio site?  Image 1 Screenshot 20

    Inside of this guide you can also find how to restore deleted forms:

    https://www.jotform.com/help/134-How-to-Restore-Deleted-Forms 

    If you have issues with some other form, please provide us exact URL of the page where your form is embedded.

    Hope this will help. Let us know if you need further assistance.

     

  • katischwiegerphotography
    Replied on November 28, 2016 at 9:23 AM

    No, I deleted that one on purpose. This is a new form. I'm trying to use the Embed code to put on my website and it just won't show up at all. It's the KSP Newborn Contract.

  • KadeJM
    Replied on November 28, 2016 at 10:12 AM

    Thank you kindly for clarifying the issue with us a bit more.

    You mean this form here https://form.jotform.com/63317711214144 correct?

    May we know which page you're trying to embed the 5th form you've mentioned isn't working and where on the page you are trying to place it?

    I've spent some time looking through your site and the page my colleague mentioned previously but, I only saw one this time and I didn't see any others listed on that page including the new form.

    I see that you are embedding the jsform script so I'd suggest that you try using the iframe code instead this time to test and see if that helps to resolve this issue for you to get it working.

    If you have anymore problems with it thought just let us know.

  • katischwiegerphotography
    Replied on November 28, 2016 at 7:28 PM

    Ok, this is the webpage: http://www.katischwiegerphotography.com/newborn-questionnaire

    I currently have the iFrame code embedded right now. And that is what it looks like.

  • katischwiegerphotography
    Replied on November 28, 2016 at 7:32 PM

    But then I have this form http://www.katischwiegerphotography.com/senior-portrait-questionnaire

    that I embedded to that webpage a long time ago but when I go to edit the page, the ebed code isn't there anymore. So I don't know what's changed. I'm so confused.

  • BJoanna
    Replied on November 28, 2016 at 9:09 PM

    On second webpage you provided http://www.katischwiegerphotography.com/senior-portrait-questionnaire form is shown correctly and it is embedded with script code. However it is not the same form as form on first page. ID of this form is 41958558214160. 

    Why cannot I not embed a form into my Zenfolio site?  Image 1 Screenshot 70

    On first webpage http://www.katischwiegerphotography.com/newborn-questionnaire you provide form is not shown correctly. 

    Why cannot I not embed a form into my Zenfolio site?  Image 2 Screenshot 81

    ID of this form is 63317711214144 and form is embedded with iFrame code. This form is not displayed correctly because of other elements of your webpage. 

    Object with class zb-embed, inside of which iFrame code of your form is added  has position set to absolute. This should be changed to relative or removed. 

    Why cannot I not embed a form into my Zenfolio site?  Image 3 Screenshot 92

    And inline width of class zb-richtext is set to 300px. 

    Why cannot I not embed a form into my Zenfolio site?  Image 4 Screenshot 103

    You can change it to 750px and then your form will be shown correctly.

    Why cannot I not embed a form into my Zenfolio site?  Image 5 Screenshot 114

    Also it seems that you have added link of your form at some point. You can remove it. 

    Why cannot I not embed a form into my Zenfolio site?  Image 6 Screenshot 125

    Hope this will help. Let us know if you need further assistance. 

  • katischwiegerphotography
    Replied on November 29, 2016 at 10:44 AM

    Why cannot I not embed a form into my Zenfolio site?  Image 1 Screenshot 20

    This is the only place I have to edit what my form will look like when it shows. Where can I edit that information?

  • katischwiegerphotography
    Replied on November 29, 2016 at 10:46 AM

    I guess I don't understand what's changed. I embedded my Senior Portrait Questionnaire exactly the same as I am trying to embed this new questionnaire and the Senior one worked fine but this one is not.

  • KadeJM
    Replied on November 29, 2016 at 11:37 AM

    We do apologize about this continuing to be an issue for you. 

    Something else you can try is just using the iFrame to see if that helps at all and leaving out the second part of it that contains the script that was included with the iframe code.

    Try Only This from the iFrame Code:

    <iframe id="JotFormIFrame-63317711214144" onDISABLEDload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotform.com/63317711214144" frameborder="0" style="width:100%; height:539px; border:none;" scrolling="no"> </iframe>

     

    Leave Out This iFrame Code Script:

    <script type="text/javascript"> window.handleIFrameMessage = function(e) { var args = e.data.split(":"); var iframe = false; if (args.length > 2) { iframe = document.getElementById("JotFormIFrame-" + args[2]); } else { iframe = document.getElementById("JotFormIFrame"); } if (!iframe) return; switch (args[0]) { case "scrollIntoView": iframe.scrollIntoView(); break; case "setHeight": iframe.style.height = args[1] + "px"; break; case "collapseErrorPage": if (iframe.clientHeight > window.innerHeight) { iframe.style.height = window.innerHeight + "px"; } break; case "reloadPage": window.location.reload(); break; } var isJotForm = (e.origin.indexOf("jotform") > -1) ? true : false; if(isJotForm && "contentWindow" in iframe && "postMessage" in iframe.contentWindow) { var urls = {"docurl":encodeURIComponent(document.URL),"referrer":encodeURIComponent(document.referrer)}; iframe.contentWindow.postMessage(JSON.stringify({"type":"urls","value":urls}), "*"); } }; if (window.addEventListener) { window.addEventListener("message", handleIFrameMessage, false); } else if (window.attachEvent) { window.attachEvent("onmessage", handleIFrameMessage); } if(window.location.href && window.location.href.indexOf("?") > -1) { var ifr = false; if (args.length > 2) { ifr = document.getElementById("JotFormIFrame-" + args[2]); } else { ifr = document.getElementById("JotFormIFrame"); } var get = window.location.href.substr(window.location.href.indexOf("?") + 1); if(ifr && get.length > 0) { var src = ifr.src; src = src.indexOf("?") > -1 ? src + "&" + get : src + "?" + get; ifr.src = src; } } </script>


    However, since you said it's working with your other forms and based on my colleagues response above I am wondering if perhaps the theme is blocking the form from being added to the page area where you've been attempting to embed it. For instance the theme's containers and setup could be covering it up hence what was said about the z-axis which is masking it from view.

    To try to assist with getting to the bottom of this problem moreover I've created a trial testing account for us to check on it a bit more with your forms.

    However, to check it more accurately for such may we know what theme you chose in zenfolio?