how do you add lightbox to a button?

  • Profile Image
    smcwilliams
    Asked on May 28, 2014 at 10:26 AM

    I am using wordpress and i am trying to add the lightbox feature to a button to display the form i created on JotForm. Can you help?

    The "Complete Registration Form Here" Button here: http://yourpc411.com/clients/avrec/?page_id=5318

     

    This is the button shortcode: [aio_button align="left" animation="none" color="blue" size="small" icon="none" text="Complete Registration Form" relationship="dofollow" url="http://form.jotform.us/form/32907023783152"]

     

    This is what put in wordpress but it didnt work:
    <script src="//max.jotfor.ms/static/feedback2.js?3.2.2041" type="text/javascript">

    new JotformFeedback({

    formId:'32907023783152',

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

    windowTitle:'Client Patient Information',

    background:'#080807',

    fontColor:'#FFFFFF',

    type:2,

    height:500,

    width:700

    });

    </script>

    <a class="lightbox-32907023783152" style="cursor:pointer;">[aio_button align="left" animation="none" color="blue" size="small" icon="none" text="Complete Registration Form" relationship="dofollow" url="http://form.jotform.us/form/32907023783152"]</a>

  • Profile Image
    BDAVID
    Answered on May 28, 2014 at 11:48 AM

    To use a button, just simply use the lightbox class from your lightbox embed code on your buttons code. Example:

     <script src="//max.jotfor.ms/min/g=feedback2" type="text/javascript">

    new JotformFeedback({

    formId:'30452332860952',

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

    windowTitle:'Title Me',

    background:'#FFA500',

    fontColor:'#FFFFFF',

    type:false,

    height:500,

    width:700

    });

    </script>

    <input class="lightbox-30452332860952" type="button" value="Click Here" />

    Hope this helps you, Let us know if you need further assistance.

  • Profile Image
    smcwilliams
    Answered on May 28, 2014 at 11:59 AM

    That did work thank you, but is there any way to customize those buttons for my websites? 

  • Profile Image
    ashwin_d
    Answered on May 28, 2014 at 01:05 PM

    Hello smcwilliams,

    Yes is is possible to customize your button. You can add style attribute in your button code. Example:

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

     

    I just added few sample codes to customize the look of the button. You can add any style information of your choice.

    Hope this helps.

    Do get back to us if you have any questions.

    Thank you!

  • Profile Image
    smcwilliams
    Answered on May 28, 2014 at 01:14 PM

    Thank you!