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

    Open to full page embed code works on one form but not the other

    Asked by CDICORP on October 11, 2016 at 09:55 AM

    I have 2 forms which I have embedded a catalog into.

     

    When you click the catalog you are supposed to see a full version of the catalog.

     

    It works on one form but not the other,.

     

    Here are the 2 forms and here is the embed code for both.

     

    Does not work - https://www.jotform.com/CDICORP/b2ecatalog

     

    This one works - https://www.jotform.com/CDICORP/folds-of-honor-Catalog

     

     

     

     

     

    Good Code:

     

    <p><iframe src="https://cdns.snacktools.net/flipsnack/embed_https.html?hash=fdc8w39pb&amp;wmode=window&amp;bgcolor=EEEEEE&amp;t=14604987441460498744" width="640" height="385" frameborder="0" scrolling="no"></iframe></p>

     

     

    Bad Code:

     

    <p><iframe src="//cdn.flipsnack.com/widget/flipsnackwidget.html?hash=ft3axe443&amp;bgcolor=EEEEEE&amp;t=1476193066" width="640" height="385" frameborder="0" scrolling="no"></iframe></p>

    Page URL:
    https://form.jotform.com/CDICORP/b2ecatalog

  • Profile Image
    JotForm Support

    Answered by KadeJM on October 11, 2016 at 10:43 AM

    It seems to me that you're having an issue using our text (html) field to embed your catalogs onto your jotform with one working and not the other.

    If you look at your links you'll notice your bad link is broken because it's not the same as the other according to the good and bad codes you've provided above so I am under the impression that might be the cause of this issue but, please allow us some time to investigate it for you.

     

  • Profile Image

    Answered by CDICORP on October 11, 2016 at 10:55 AM

    Sorry I might have pasted the wrong code before.

     

    This is the one that is not working

     

    <iframe src="//cdn.flipsnack.com/widget/flipsnackwidget.html?hash=ft3axe443&bgcolor=EEEEEE&t=1476193066" width="640" height="385" seamless="seamless" scrolling="no" frameBorder="0" allowTransparency="true" allowFullScreen="true"></iframe>

  • Profile Image
    JotForm Support

    Answered by KadeJM on October 11, 2016 at 11:25 AM

    After testing this some it appears that the problem is with the code that you're trying to use for the one that's not working as it seems to be is incompatible because it's using a different widget url setup for its embedded iframe version compared to the other one that's working.

    I've been tinkering around with some adjustments to the catalog code you gave us on a test copy of your form but, so far I'm not having much luck and it will be a bit difficult to investigate more accurately unless I can find a catalog embed tool to test this out with more accurately.

    Where or what are you using to make these catalogs that you are trying to embed?

    It wasn't from us I don't think was it?

    To prove my point if you take your provided code that you're trying to plug into our text field and test it as a standalone by itself here http://htmledit.squarefree.com/ you'll notice the same problem with the code catalog being used outside our platform as well.

  • Profile Image

    Answered by CDICORP on October 11, 2016 at 11:32 AM

    Thanks,

     

    The catalog is generated through flipsnack.

     

    I will follow up with their support and see if they can figure it out.  I'll keep you posted if I need any other info from you.

     

    Thanks for your help

  • Profile Image
    JotForm Support

    Answered by KadeJM on October 11, 2016 at 02:11 PM

    Thanks for letting me know about that.

    I found they have a free plan so I was able to investigate this issue furthermore to try to assist with getting to the bottom of this so that you can get your embedded catalogs up and running with forms.

    However, I'm not sure which templates you used? Or did you create yours from scratch?

    Are they the same type between the two? I am thinking it's not because of the different starting url.

    I believe I've managed to narrow the problem a little more as it seems to be related to the size of the frame for that particular setup.

    If you change your height and width to a much larger value then when you click on it you'll then see the options to go full screen properly.

    But, if smaller for some reason it's ignoring it for that particular embed link limiting it to such as you had it seems to break the one link that isn't working for some reason hiding it unless wider then it works. Otherwise, the result is staying small with the loss of the full screen functionality and that points back to the one url different than the other.

     

    Your Good Code:

     <p><iframe src="https://cdns.snacktools.net/flipsnack/embed_https.html?hash=fdc8w39pb&amp;wmode=window&amp;bgcolor=EEEEEE&amp;t=14604987441460498744" width="640" height="385" frameborder="0" scrolling="no"></iframe></p>

     

    Your Bad Code:

     <p><iframe src="//cdn.flipsnack.com/widget/flipsnackwidget.html?hash=ft3axe443&amp;bgcolor=EEEEEE&amp;t=1476193066" width="640" height="385" frameborder="0" scrolling="no"></iframe></p>

     

    I'll do some more digging of this on our end in my spare time in case I can find a solution and do let us know if they have a better link that'd work with you for such.

    Larger Demo (Working - but, cut off when full screened):

    https://form.jotform.com/62843990673973 

     

  • Profile Image

    Answered by CDICORP on October 11, 2016 at 04:45 PM
    Thanks.... I'm still waiting on feedback from flipsnack to see if they can
    shed any light on this issue.

    ...
  • Profile Image

    Answered by CDICORP on October 12, 2016 at 09:56 AM

    That didn't seem to do anything different.  Still won't go to full screen.

  • Profile Image
    JotForm Support

    Answered by KadeJM on October 12, 2016 at 10:51 AM

    I do apologize about that as it was only going larger within the frame on my end.

    I've also discussed this with one of my colleagues just to get a second opinion about the cause of the issue and unfortunately he confirmed the same that we believe it's due to the code being embedded.

    Was there a template that you used for both of those flipbooks? Or did you make them from scratch?

    That could possibly explain the differences in the code you were trying to embed since the one was working and the other wasn't.

  • Profile Image

    Answered by CDICORP on October 12, 2016 at 05:44 PM
    I created these at different times so I'm not exactly sure if I took
    different steps to create one over the other.
    ...
  • Profile Image
    JotForm Support

    Answered by Jim_R on October 13, 2016 at 01:04 AM

    Thanks for getting back to us. From how I see it when I compare the 2 sets of codes you gave us, the src tag doesn't dictate the behavior of the catalog (whether it opens in full screen or not). It's more likely due to how the catalogs were created/setup.

    You can give it a quick try by opening them both on their standalone versions:

    1. Fullscreen

    https://cdns.snacktools.net/flipsnack/embed_https.html?hash=fdc8w39pb&wmode=window&bgcolor=EEEEEE&t=14604987441460498744

    2. Not fullscreen

    http://cdn.flipsnack.com/widget/flipsnackwidget.html?hash=ft3axe443&bgcolor=EEEEEE&t=1476193066

    If you would look closely, both URLs have a few parameters in common, but the hash= and t= values are what interests me. If I try to use the base URL from #1 and get the hash and t values of URL #2, here's what I would have:

    https://cdns.snacktools.net/flipsnack/embed_https.html?hash=ft3axe443&wmode=window&bgcolor=EEEEEE&t=1476193066

    With this URL, the src tags are now the same except the hash and t parameters. Clicking that new link will open that same 2nd catalog above, no changes, same behavior, and still won't open in fullscreen.

    I'm afraid this is beyond our Scope of Support. The best assistance we can give you is to figure out what's causing the problem and a possible way to fix it.

    If I'm in your shoes, I will be checking if the 2nd catalog has further options/settings inside my Flipsnack account that will make it behave the same way as the 1st one.