Why does not my lightbox show up when I preview it? It does not appear on my website either.

  • Profile Image
    onaidac
    Asked on October 25, 2020 at 05:56 AM

    Hi, I am trying to add a LIGHTBOX form to a Shopify website that we are building. I embedded the form code in a custom snippet. However the form doesn't show any field. If I embed the code as a popup form I do see the fields. Thanks for your time.



    This is a re-post of a comment on Setting up the Thank You Page

  • Profile Image
    Sonnyfer
    Answered on October 25, 2020 at 06:24 AM

    Hi there - Perhaps the code of your website and lightbox is conflicting. Could you please share with us the exact URL where you embedded your form so we can check? If possible, please send us screenshots as well to better illustrate the issue.

    Guide: How-to-Post-Screenshots-to-Our-Support-Forum

    Looking forward to your reply.

  • Profile Image
    onaidac
    Answered on October 25, 2020 at 07:39 PM

    Hi, thanks for responding. My web store is not public yet.

    I created a custom snippet and I am calling it from cart-template.liquid. See screenshots.1603669040_5f960c30d571a_Screen Shot 2021603669108_5f960c7424e36_Screen Shot 202


    See that the form shows up without any field below:

    1603669135_5f960c8f13001_Screen Shot 202

  • Profile Image
    onaidac
    Answered on October 25, 2020 at 08:04 PM

    it doesn't work in the preview option of the jotform "Customize Lightbox" either

    1603670648_5f9612786a302_Screen Shot 202

  • Profile Image
    ashwin_d
    Answered on October 26, 2020 at 02:48 AM

    Please use the following lightbox embed code and see if it works as exoected:

    <script src ="https://form.jotform.com/static/feedback1.js" type="text/javascript"></script><script type="text/javascript">

        var JFL_202927402797159 = new JotformFeedback({

         formId: '202927402797159',

              base: 'https://form.jotform.com/',

         windowTitle: 'Medical History',

         background: '#b8e986',

         fontColor: '#FFFFFF',

         type: '0',

         height: 500,

         width: 700,

         openOnLoad: false

        });

      </script>

       <a class="btn lightbox-202927402797159" style="margin-top: 16px">

        Complete Medical History

       </a>

    Do try it out and get back to us if the issue persist.

    We will wait for your response.

  • Profile Image
    onaidac
    Answered on October 26, 2020 at 09:52 AM

    Hi, thank you for responding so quickly.

    I made the change on the embed code. However, now nothing happens when I clicked on the button "Medical History".

  • Profile Image
    Simon_L
    Answered on October 26, 2020 at 11:24 AM

    Hello,

    I was able to isolate your issue. It is related to the access settings of your form.

    I can see that your form is currently set to Private; I have tested it, and the lightbox does not work on my end either. However, when I set it to Public, it works.

    I invite you to watch the Loom video I recorded about your issue, and how to solve it: click here!

    I suggest that you set your form to Public. If you do not want people to see your form without allowing them first, you could enable password protection, or enable SSO on your form.

    Let us know if that helps,

    Thank you!


  • Profile Image
    onaidac
    Answered on October 26, 2020 at 12:06 PM

    Hi, thanks, that worked and the fields are showing up.

    However, after I complete the form fields and click on submit button the form stays on but blank, I had to close it with the X on the top right.

    Also, can you tell what is wrong with the birthdate field that doesn't allow me to enter any data.

    Thanks again



  • Profile Image
    onaidac
    Answered on October 26, 2020 at 12:17 PM

    I fixed the issue with the Birthdate field.

    Regarding the form staying blank after clicking on Submit button, I see the message "Redirect blocked".

    I am using the Thank you page option to redirect to check out page.

    Thanks


  • Profile Image
    onaidac
    Answered on October 26, 2020 at 12:54 PM

    I see that my browse is blocking the redirect.

    I wonder if this will prevent me from using lightbox or if there is a way around it.


    Thanks

  • Profile Image
    Simon_L
    Answered on October 26, 2020 at 02:19 PM

    Hello,

    Depending on your browser's settings, the browser could indeed block the redirection.

    I do not think this will prevent you from using the Lightbox. I have sent a test submission, and no popup/redirection was blocked on my end. Please watch this GIF:

    1603736346_5f97131ae90a2_recording.gif

    As you can see, I was redirected to your Shopify page instantly. I believe this is what your users will experience too.

    Let us know how we can be of any further assistance,

    Thank you!