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

    How to turn Lightbox text link into a button.

    Asked by Ubasti on May 09, 2015 at 05:43 AM

    Hey JotForm, first let me start off by saying I absolutely love your product. 

     

    I have a jotform lightbox working perfectly, but I'd like to make it into a button instead of hyperlink if possible.

     

    I've read numerous posts already, but can't seem to get it to function properly. I've created the button, but it doesn't appear to provide the lightbox when clicked. It does however work fine when it's a normal link.

     

    Here is the code below:

     

     

    <script src="//d2g9qbzl5h49rh.cloudfront.net/static/feedback.js?3.2.7054" type="text/javascript">// <![CDATA[

    var JFL_51276621662152 = new JotformFeedback({ formId:'51276621662152', base:'http://jotform.us/', windowTitle:'Booster Application', background:'#1DC6DF', fontColor:'#FFFFFF', type:false, height:500, width:700, openOnLoad:false });

    // ]]></script>

     

    <input class="lightbox-30452332860952" style="cursor: pointer; border-radius: .5em; padding: 8px 18px; color: #ffffff; font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; background: #1dc6df; border: 1px solid #1dc6df;" type="button" value="Apply Now" />

    Page URL:
    www.boostpros.net/contact

    lightbox form lightbox button
  • Profile Image
    JotForm Support

    Answered by Mike_G on May 09, 2015 at 12:43 PM

    For example, this is your Lightbox embed code:

    <script src="//d2g9qbzl5h49rh.cloudfront.net/static/feedback2.js?3.2.7056" type="text/javascript">

    var JFL_51225587725965 = new JotformFeedback({

    formId:'51225587725965',

    base:'http://jotformpro.com/',

    windowTitle:'Contact Us',

    background:'#FFA500',

    fontColor:'#FFFFFF',

    type:false,

    height:500,

    width:700,

    openOnLoad:false

    });

    </script>

    <a class="lightbox-51225587725965" style="cursor:pointer;color:blue;text-decoration:underline;">Contact Us</a>

     

    Just replace the "Contact Us" text with <input id="form_button" type="button" value="Contact Us">

     

    And it should look like this after replacements:

    <script src="//d2g9qbzl5h49rh.cloudfront.net/static/feedback2.js?3.2.7056" type="text/javascript">

    var JFL_51225587725965 = new JotformFeedback({

    formId:'51225587725965',

    base:'http://jotformpro.com/',

    windowTitle:'Contact Us',

    background:'#FFA500',

    fontColor:'#FFFFFF',

    type:false,

    height:500,

    width:700,

    openOnLoad:false

    });

    </script>

    <a class="lightbox-51225587725965" style="cursor:pointer;color:blue;text-decoration:underline;"><input id="form_button" type="button" value="Contact Us"></a>

     

  • Profile Image

    Answered by Ubasti on May 09, 2015 at 05:06 PM

    Wonderful! Thank you it works great.


  • Profile Image

    Answered by raul on May 09, 2015 at 05:51 PM

    On behalf of my colleague, you're welcome.
    Feel free to contact us anytime, should you require our assistance.