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

    SquareSpace LightBox when Image Link Clicked

    Asked by phoebeseward on June 23, 2015 at 01:11 PM

    Hi,

    I have multiple images on my SquareSpace site that I would like to link to different forms. When the image is clicked, I would like a lightbox form to open.

     

    Please help me on how I would set this up.

     

    - Would I embed the lightbox code on a new page of my SquareSpace sight? (I have tried this, when the image is clicked it takes me to the site with a blue text link of the form's title, and then you must click on that link for the lightbox to open)

     

    Please do not simply reply with links to other discussions that are not relevant to my particular problem, I have seen them and they are not helping, thank you.

     

    Phoebe

    Page URL:
    http://affluentappraisals.com/hire-me-as-your-appraiser

    image link squarespace lightbox form problem different site
  • Profile Image
    JotForm Support

    Answered by Welvin on June 23, 2015 at 01:59 PM

    Hi Phoebe,

    Yes, you should embed the form using our lightbox method:

    http://www.jotform.com/help/220-How-to-Create-a-Lightbox-Form

    Now, to change the blue hyperlink to an image, you just need to replace it with your image tags. For example, this is your lightbox codes:

    <script src="https://secure.jotform.com/static/feedback2.js?3.3.7626" type="text/javascript">

    var JFL_51732076637155 = new JotformFeedback({

    formId:'51732076637155',

    base:'https://secure.jotform.com/',

    windowTitle:'Equitable Distribution &amp; Divorce Appraisals',

    background:'#ffffff',

    fontColor:'#000000',

    type:1,

    height:500,

    width:700,

    openOnLoad:false

    });

    </script>

    <a class="lightbox-51732076637155" style="cursor:pointer;color:blue;text-decoration:underline;">Equitable Distribution &amp; Divorce Appraisals</a>

    You will just change the last line from:

    <a class="lightbox-51732076637155" style="cursor:pointer;color:blue;text-decoration:underline;">Equitable Distribution &amp; Divorce Appraisals</a>

    to:

    <a class="lightbox-51732076637155"><img src="YOUR IMAGE URL HERE" style="width:304px;height:228px;"></a>

    Please don't forget to replace YOUR IMAGE URL HERE with your actual image URL.

    Let us know if you need further assistance.

    Thanks

  • Profile Image

    Answered by phoebeseward on June 23, 2015 at 05:28 PM

    Thank you so much! It works!

    Is there any way I can retain the cursor: pointer feature? Rather than the cursor remaining an arrow when it is hovering over the image link?

    Also: the images that link to the forms are in the middle part of the page, and when a form lightbox is opened & then closed, it returns to the page, but to the top of the page. In other words, someone looking at the page would click an image for the lightbox to open to learn more information, then X out of the form and need to scroll back down again. Is there a way to fix this so that once they X out they are exactly in the same position on the page as they were when they opened the lightbox?

    Here is my URL again: http://affluentappraisals.com/hire-me-as-your-appraiser

    Thanks again!

  • Profile Image
    JotForm Support

    Answered by BDAVID on June 23, 2015 at 06:53 PM

    Your two new questions, will be addressed here:

    1) http://www.jotform.com/answers/595240

    2) http://www.jotform.com/answers/595241