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

    Embedding Lightbox on Weebly

    Asked by isherclub on November 27, 2016 at 11:20 AM

    Hi,

     

    I am unable to embed the Lightbox on my weebly web site.

     

    I use the standard generated code, without modifications.

     

    The result is the text (sensible to mouse hovering) but when I click on the text, nothing happens.

    Any idea on where I could look for to find out the issue?

     

    Thanks

    Rosario

    EDIT

    I apologize for the message. I don't know why. Now it works. Sorry again.

    web site site weebly lightbox lightbox weebly lightbox on weebly
  • Profile Image
    JotForm Support

    Answered by Jan on November 27, 2016 at 04:02 PM

    I just saw the "EDIT" part of your message. It seems that your issue is now resolved.

    Thank you for updating us. If you need further help, let us know.

  • Profile Image

    Answered by isherclub on November 28, 2016 at 04:10 AM

    Hi Jan,

    I spoke too fast. It works with Chrome and Firefox on PC, It works on Opera on mobile but it does not work on Lightning (chrome engine) on Android.

    Plus it does not adjust on mobile screens.

    I would say the product (your lightbox) is not "ripe" enough to be deployed.

    You may want to give a look at how privy.com handles their lightboxes (or even ecwid.com). Those work greatly and resize on mobile or tablet or pc seamlessly.

    Of course I am referring at integrating those widgets on weebly web sites.

    I will follow your news on when you will update the product.

    Best

    Rosario

  • Profile Image
    JotForm Support

    Answered by Boris on November 28, 2016 at 04:23 AM

    Rosario, would you mind sharing the link to the page where you have embedded the form, so we can take a look whether there is anything in particular that can be done to make the lightbox work correctly on your website as well?

    There might be some kind of scripting conflicts or similar issues preventing the form from working correctly, and a link to the published page you are having these problems on will help us either try and resolve the issue for you, or at least check upon the issue and advise our developers if something needs improvement.

    Thank you.

  • Profile Image

    Answered by isherclub on November 28, 2016 at 07:55 AM

    Hi Boris,

     

    I prepared a test page: http://isher-club.weebly.com/143875327438969.html

    It works on some browsers, it doesn't on others.

    The form is not mobile-aware and I guess we need to modify something to make it work on mobile as already seen on other posts.

    Let me know if you find out what is not working.

    On the same page you will find another script for a survey I use with privy.com

    Thanks

    Rosario

  • Profile Image
    JotForm Support

    Answered by Boris on November 28, 2016 at 08:39 AM

    I have checked your embed codes and your embedded form, https://form.jotformeu.com/form/63322936695364, and I see several issues.

    The first one is that the form is created in such a way that it needs at least 418 pixels of width in order to display fully. As such, it you use a device that has a screen narrower than 418 pixels, you would need to scroll the form both vertically and horizontally.

    The second issue is the embed codes themselves. Your embed code has a hard-coded width of 600 pixels:

    <script src="https://form.jotformeu.com/static/feedback2.js?3.3.REV" type="text/javascript"> var JFL_63322936695364 = new JotformFeedback({ formId: '63322936695364', base: 'https://form.jotformeu.com/', windowTitle: 'The Isher s Club Shop - Basic Plan - PayPal and Credit Cards', background: '#FFA500', fontColor: '#FFFFFF', type: 'false', height: 800, width: 600, openOnLoad: false }); </script>
    <a class="btn lightbox-63322936695364" style="margin-top: 16px"> Clone of Basic Plan - PayPal </a>

    And I believe that what you are looking for instead, is to have a resizable lightbox popup, as shown in the following screen recording:

    In order to have your LightBox responsive like that, you should change your embed codes into this instead:

    <script src="https://form.jotformeu.com/static/feedback2.js?3.3.REV" type="text/javascript"> var JFL_63322936695364 = new JotformFeedback({ formId: '63322936695364', base: 'https://form.jotformeu.com/', windowTitle: 'The Isher s Club Shop - Basic Plan - PayPal and Credit Cards', background: '#FFA500', fontColor: '#FFFFFF', type: 'false', height: false, width: false, openOnLoad: false }); </script>
    <a class="btn lightbox-63322936695364" style="margin-top: 16px"> Clone of Basic Plan - PayPal </a>

    In Addition to that, you should also add the following part inside the same page of your website:

    <style type="text/css">
    .jt-feedback.ui-draggable { width: 100%; max-width: 700px; }
    </style>

    That is it, your LightBox embedded form should be mobile responsive, as shown in the above provided screen recording. Please try it out, and let us know should you need further assistance.