Can I have a form auto-pop up on website?

  • Profile Image
    angiehills
    Asked on February 19, 2014 at 09:24 AM

    Can I have a form (image with link to FB) to pop up on website after 30 seconds or so to invite them to join us & like us on FB for a chance to win?

     

    I see a lightbox embed code & a popup one - but looks like popup is linked to a text or button link? And I'm not sure about lightbox - can either of these, or another method be used & setup to auto-popup and have an option to click link or close?

     

    Thanks!

  • Profile Image
    BDAVID
    Answered on February 19, 2014 at 10:10 AM

    Hi, you can embed your form using the lightbox code, and make it Auto-pop up, please look a this guide to accomplish that.

    If you need to add a image link, to redirect them to your Facebook page, you can:

    1) Add the Image field under Form Tools

    2) Click on the Image Link icon, and the URL to you Facebook page.

    If you want the user to open or close the link to the form, I would recommend you to embed your form with the feedback embedded method. 

    This is a site I have just for testing porpuses, you can check how it looks the Feedback embedded method. Let us know if you have more questions.

  • Profile Image
    angiehills
    Answered on February 19, 2014 at 11:29 AM

    Awesome! :) I've done it - but seem to have something wrong. Like a blank light box opening in front of or something???? Is there something wrong with my code? Or something on my website?

    Also - how can I get the sizing to be accurate & not have to have scroll bars?

    Also - i don't need the Title Me link at the top left - Can I remove that without messing up the code? If so - what all do I remove out of the code?

    Thanks!

  • Profile Image
    EliezerN
    Answered on February 19, 2014 at 11:50 AM

    Hi,

    Could you please share with us the URL of your webpage where your form is embedded? That way we can further investigate and provide the proper assistance to solve the issue.

    We will wait for your reply.

    Thanks

  • Profile Image
    angiehills
    Answered on February 19, 2014 at 11:52 AM

    Sorry - I meant to share that. Here it is:

    http://www.plexus-health-and-wellness.com/

  • Profile Image
    EltonCris
    Answered on February 19, 2014 at 01:10 PM

    Hi,

    Please replace your codes with the following, this should resolved the first and third issues. Bolded part are the ones changed.

    <script src="//cdn.jotfor.ms/static/feedback.js?3.2.606" type="text/javascript">

    new JotformFeedback({

    formId:'40493393031147',

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

    windowTitle:'',

    background:'#FFFFFF',

    fontColor:'#FFFFFF',

    type:1,

    height:630,

    width:900

    });

    </script>

    <a id="lightboxdelay" class="lightbox-40493393031147" style="cursor:pointer;color:blue;text-decoration:underline;display:none;">Title Me</a>

    <script language="JavaScript">

    var delayseconds = 5;

        function pause() {

        myTimer = setTimeout('whatToDo()', delayseconds * 1000)

        }

       function whatToDo() {

    document.getElementById('lightboxdelay').click();

        }

    window.onload = pause;

    </script>

    And then inject this CSS codes to your form after that to removed the scrollbars.

    .form-all{margin:0 !important;}

    Guide: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    Feel free to let us know here should you need further assistance.

    Regads!

  • Profile Image
    angiehills
    Answered on February 19, 2014 at 01:56 PM

    FANTASTIC!

    Jotform & Support staff is AWESOME! 

    Thanks so much!

  • Profile Image
    angiehills
    Answered on February 20, 2014 at 11:06 PM

    I uploaded a smaller size photo & tried editing the size in the code above for the light box - but the image still doesn't sit center in the light box & has a scroll bar.

    Can you please advise how to adjust the code to center the image inside the lightbotx & remove the scrollbar?

    Also - I'm testing this website on my mobile divice (full layout of website & testing responsive) and I don't see this pop up on either. Should it pop up on mobile - I would like it to & would like it to redice size for mobile device.

    Thanks in advance!

  • Profile Image
    ashwin_d
    Answered on February 21, 2014 at 01:06 AM

    Hello angiehills,

    I have injected the following custom css in your form and the lightbox seems to appear correctly in your web page:

    .form-all {padding-left:-20px;margin-left:-33px;

    margin-right:-64px;}

    Please take a look at the screenshot below:

    Do check and get back to us if you need any other changes.

    Thank you!

  • Profile Image
    angiehills
    Answered on February 21, 2014 at 10:40 AM

    The sizing & placement is perfect! Thank-You!

     

    But I'm checking on my mobile & it doesn't seem to pop up at all? I would like it to show on mobile as well & re-size for mobile.

     

    Thanks!

  • Profile Image
    pinoytech
    Answered on February 21, 2014 at 11:26 AM

    Hi,

    Your form is working fine on my end upon checking. Please take a look at this video: http://www.screencast.com/t/3Nrq34Xyr

    I would like it to show on mobile as well & re-size for mobile.

    Inject this custom css in to your form to do the trick.

    @media only screen

    and (min-device-width : 320px)

    and (max-device-width : 480px) {

    /* Styles */

    .form-image {

    margin-left: -95px !important;

    }

    }

    If you need further assistance, please let us know.