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

    Installing Lightbox in DNN (DotNetNuke)

    Asked by TrainingAdvisor on March 17, 2014 at 08:53 PM

    Hi,

     

    Really hope that I can get some assistance on this. I am currently trying to install lightbox forms using JotForm on our website that operates on DNN v6. 

    All other code's work on the site includign popup's. This is the code I am dropping into the iframe.

    Thanks.

    Matt

     

    <script src="//cdn.jotfor.ms/static/feedback.js?3.2.929" type="text/javascript">

    new JotformFeedback({

    formId:'40520457613852',

    base:'http://jotform.co/',

    windowTitle:'Ask a Question',

    background:'#FFA500',

    fontColor:'#FFFFFF',

    type:false,

    height:500,

    width:700

    });

    </script>

    <a class="lightbox-40520457613852" style="cursor:pointer;color:blue;text-decoration:underline;">Ask a Question</a>

    DNN JotForm style height cdn
  • Profile Image
    JotForm Support

    Answered by jonathan on March 17, 2014 at 10:12 PM

    Hi Matt,

    Can you please share to us the URL of your DNN website where we can test the form? We need more details to be able to provide the appropriate response and give suggestions.

    Using the JotForm guide https://www.jotform.com/help/189-How-to-add-a-form-to-DotNetNuke ,
    you may also try embedding the lighbox code into the html widget of the DNN editor

     

    Hope this help. Inform us if you need further assistance.

    Thanks!

  • Profile Image

    Answered by TrainingAdvisor on March 17, 2014 at 10:46 PM

    Hi Jonathan,

     

    Thanks for this, I have no problem installing iframe or popup code this way in DNN. But light box code does not work this way. I input the code and click the link and nothing happens... 

    The site is not currently on the web so can't share the link publically sorry.

     

    Matt

  • Profile Image

    Answered by TrainingAdvisor on March 17, 2014 at 10:47 PM

    How can I install Lightbox's using Jotform in DNN? might be a better question for me to ask.

     

    Thanks,

     

    Matt

  • Profile Image
    JotForm Support

    Answered by jonathan on March 17, 2014 at 11:29 PM

    Hi Matt,

    What I think you can do is embed first the lighbox code to a separate webpage then use that webpage as the source page when in the iframe code you will embed in the DNN html widget.

    Steps:

    1. Create new blank page i.e. http://mywebsite.com/testblank.html 

    2. Using the new page, add the lightbox code to it.

    3. Use the iframe code to embed the created page in step#1  into the DNN html widget. The iframe code should look similar to this

    <iframe allowtransparency="true" src="//mywebsite.com/testblank.html" frameborder="0" style="width:100%; height:600px; border:none;" scrolling="no"></iframe>

    noticed the highlighted src referring to the created external page.

    Hope this help. Inform us if you need further assistance.

    Thanks.

     

  • Profile Image

    Answered by TrainingAdvisor on March 18, 2014 at 02:18 AM

    When you say add the code to that page do you mean the headero or skin? or a module on that page?

     

    Thanks,

     

    Matt

  • Profile Image

    Answered by TrainingAdvisor on March 18, 2014 at 02:54 AM

    I fixed the issue by swithching from the Rich Editor to the Basic Editor and applying the code in text html.

     

    I used this code.

    <script src="//cdn.jotfor.ms/static/feedback.js?3.2.930" type="text/javascript">new JotformFeedback({formId:'40520457613852',base:'http://jotform.co/',windowTitle:'Ask a Question',background:'#FFA500',fontColor:'#FFFFFF',type:false,height:350,width:550});</script><a class="lightbox-40520457613852" style="cursor:pointer;color:blue;text-decoration:underline;"><img alt="Ask a question button" src="/portals/0/Buttons/Internal%20BB%20Nav/BB%20Ask%20a%20Question.jpg" longdesc="Ask a question button opens a lightbox form" style="width: 180px; height: 50px;" /></a>

     

    Thanks,

     

    Matt

  • Profile Image

    Answered by TrainingAdvisor on March 18, 2014 at 03:10 AM

    I should also add that to get it to work on DNN you cannot have duplicate code on the same page or it will get confused and open more than one light box. I also did as Jon advised and installed the full script on a test page, check it worked then recopied the shortened code to the pages it is to be used on.

     

    Cheers,

     

    Matt