FYI: About lightbox option for forms - adding custom styling class

  • AA_C
    Asked on July 9, 2016 at 1:37 PM

    Hi,

    I have used the "lightbox" option for posting forms with great success but for one thing.

    We use a specified css color coding for our links. The "lightbox" code, as given, will not allow the option for this.

    I have found a workaround that works nicely.

    For example the following script:

    <script src="https://form.jotform.com/static/feedback2.js?3.3.REV" type="text/javascript"> var JFL_60917387727973 = new JotformFeedback({ formId: '60917387727973', base: 'https://form.jotform.com/', windowTitle: 'Junior Handler - Jeunes conducteurs', background: '#cc0000', fontColor: '#FFFFFF', type: '1', height: 550, width: 610, openOnLoad: false }); </script> <a class="btn lightbox-60917387727973" style="margin-top: 16px"> Junior Handler ID Card </a>

    Will not allow for our class for links which is "class=redLink10" 

    In order to accomplish this I use a <div> like so and add our class:

     
    <div class="lightbox-60917387727973">
    <script src="https://form.jotform.com/static/feedback2.js?3.3.REV" type="text/javascript"> var JFL_60917387727973 = new JotformFeedback({ formId: '60917387727973', base: 'https://form.jotform.com/', windowTitle: 'Junior Handler - Jeunes conducteurs', background: '#cc0000', fontColor: '#FFFFFF', type: '1', height: 550, width: 610, openOnLoad: false }); </script> <a class="redLink11"  href="#" style="margin-top: 16px"> Junior Handler ID Card </a> 
    </div>

    Note that the href for the link with a hash (#) sign must be added for it to work. 

    I just wanted to post this as it may be helpful to some other users.

    If anyone can find this helpful or issues with this please let me know.

     

    Regards,

    Robert

    To view the results use the link below and select the junior Handler ID Card (On line) option.

  • Mike
    Replied on July 9, 2016 at 5:32 PM

    Thank you for sharing, Robert. Great example!