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

    Trigering a Lightbox form via a button, rather than text

    Asked by JohnFraserScott on January 17, 2015 at 02:40 AM

    I have created a form that I would like to use as a Lightbox form embedded on my site. The problem is, as it stands, it simply appears as clickable text and I wanted to be able to click a button to open up the embedded Lightbox form.

    If it matters, this is for a Wordpress site.

    Really hoping you can make some suggestions.

    Kind regards,
    Vlad

    lightbox form problem clickable site
  • Profile Image
    JotForm Support

    Answered by jonathan on January 17, 2015 at 10:43 AM

    Hi Vlad,

    This is doable in Jotform. Please check this similar thread

    Here's how to create a lightbox form. How to Create a Lightbox Form

    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" />

     

     

    Please let us know if you need further assistance doing it.

    Thanks.

     

  • Profile Image

    Answered by JohnFraserScott on January 18, 2015 at 09:03 PM

    Thank you, I have tried this and it worked for me!

    My only question is how to control the appearance of this button? Can I do one of two things?

    1) Use some code to control the size, colour, shape of the button and colour of the font?

    2) Use an image in place of a button?

    Thank you,
    Vlad

  • Profile Image
    JotForm Support

    Answered by EltonCris on January 19, 2015 at 03:37 AM

    Hi Vlad,

    Glad to hear it works for you. :)

    1. It is possible with CSS, you can insert style attribute on the button code. This method is called Inline CSS.

    Example:

    <input class="lightbox-30452332860952" type="button" value="Click Here" style="font-size:16px;background:#01A2A6;border:none;padding:8px;color:#fff;" />

    Result: http://jsfiddle.net/gw4yjona/

    2. Image is also possible as long as you'll use the class that will call the lightbox form.

    Example:

    <img class="lightbox-30452332860952" src="http://www.yoursite.com/image/your_button.png" />

    Just replace the sample URL on this code with your button image URL.

    Hope this helps. Thanks!