how can i add the pop up form window.?

  • Profile Image
    m.waqar
    Asked on August 23, 2012 at 02:57 AM

    Hi,

    can you pls help me in making pop-up form.? i want the pop-up form to be appear on clicking sign In button. can you tell me the code to make a pop-up form.? and pls also let me know where should i insert the code.? pls rep me as soon as possible.. 

    regards;

    M.Waqar

  • Profile Image
    idarktech
    Answered on August 23, 2012 at 03:04 AM

    Hi m.waqar

    Thanks for visiting JotForm.

    You can actually add the code anywhere on your dreamweaver pages, you can try this short guide. Regarding the button pop-up, you can try this code:

    <a target="_blank" href="javascript:void( window.open('https://www.jotform.com/form/12082918378','blank','scrollbars=yes,toolbar=no,width=700,height=500'))"><input type="button" value="CLICK HERE" /></a>

    Hope this helps. Thank you!

  • Profile Image
    idarktech
    Answered on August 23, 2012 at 04:20 AM

    @M.Waqar,

    Yes, have you tried my codes above for a clue? See how it works here: http://jsfiddle.net/ZEndv/

    If you'd like to add it on your existing sign in button then please let us know your website URL and specify from where this codes should be inserted to. Thanks!

  • Profile Image
    M.waqar
    Answered on August 23, 2012 at 06:04 AM

    yes sir i tried your code but sir my need is diffent. its something else. My Question is that how should i add a lightbox or pop up form in my website.? i am new. i am having difficulty thts y i am seeking your help.

  • Profile Image
    idarktech
    Answered on August 23, 2012 at 06:12 AM

    Ok, sorry about that.

    Like I've said on my previous post, you can actually add the codes anywhere on your webpage source code, must be between the body tags. It's like copy and pasting the codes to your page source. You can also visit our Help Section for a guides, here: http://www.jotform.com/help/chapter-3-Share+Forms

    Just one question, do you use CMS?

    Thanks.

  • Profile Image
    M.Waqar
    Answered on August 23, 2012 at 06:17 AM

    you can check this URL:http://www.alessioatzeni.com/wp-content/tutorials/jquery/login-box-modal-dialog-window/index.html

     

    i want to add this type of pop-up form in my website.

    and my website is:

    www.limonscene.com

     

    on my web (limonscene) their is Sign in button right on top. i want that when i click on this sign in button. a pop-up form appears. right now when i click on it. it directs me to my button link and the new form window appears. i dont want this. i want that when i click on sign in button pop-up form appears and the user fills that form to log-ig to my website.

    i want the pop up form in my website like its shown in ths URL:http://www.alessioatzeni.com/wp-content/tutorials/jquery/login-box-modal-dialog-window/index.html

     

  • Profile Image
    M.Waqar
    Answered on August 23, 2012 at 06:29 AM

    no i donot use content management system.

  • Profile Image
    idarktech
    Answered on August 23, 2012 at 07:00 AM

    Great! Thanks for clarifying it well. :)

    By the way, did you already created your form? If you have already a form with us then here's what I can suggest in order to mimic the functionality that you're looking for.

    1. Create your form with JotForm

    2. After creating your form, get your lightbox embed code.

    Example:

     

    <script src="//jotform.me/min/g=feedback2" type="text/javascript">

    new JotformFeedback({

    formId:'21880967745468',

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

    windowTitle:'Title Me',

    background:'#FFA500',

    fontColor:'#FFFFFF',

    type:false,

    height:500,

    width:700

    });

    </script>

    <a class="lightbox-21880967745468" style="cursor:pointer;color:blue;text-decoration:underline;">Contact Us</a>

    3. Now, open your index.html file then search for the sign in codes. e.g. 

    <li><a class="" target="_blank" href="admin/index.html" id="sign_in_slider">Sign In &raquo;</a></li>

    4. After that, paste the lightbox script code above the sign in codes. Then copy the highlighted class above which is lightbox-21880967745468  and paste it to your sign in code class. Please check this image for a guide: http://pasteboard.s3.amazonaws.com/images/1345719043575868.png

    5. See how it works here: http://idarktech.com/test/test_user_site.html

    Let me know if you have further questions or need further clarifications. Thank you!

  • Profile Image
    M.waqar
    Answered on August 23, 2012 at 07:45 AM

    Thanks for the reply. its really v.much helpful for me but i want to make some changes in it. i am changing the layout of my website (limonscene). i am changing it completely and making it in a new way. i want to make some changes in the light-box which you have created but i cant edit the nova.Css file. can you guide me for this.??

  • Profile Image
    jonathan
    Answered on August 23, 2012 at 10:05 AM

    @M.waqar

    Hi, you can actually make changes on the form's look and feel by using injected CSS code on it.

    But if you really want to modify the CSS source code file, you may need to download the form's source code. Use this guide http://www.jotform.com/help/104-How-to-Download-a-Source-Code-of-your-Form

    Hope this help.

    Thanks.

  • Profile Image
    piyush
    Answered on September 21, 2012 at 06:15 AM

    Thanks sir ...it worked

  • Profile Image
    guest_23200971566048
    Answered on November 16, 2012 at 12:33 AM

    I created a form using jotform but I didn't get LightBox embeded code.Plz help me

  • Profile Image
    idarktech
    Answered on November 16, 2012 at 12:44 AM

    @guest_23200971566048

    Here's how to get your lightbox embed code:

    Let us know if you have further questions. Thanks!

  • Profile Image
    guest_23200971566048
    Answered on November 16, 2012 at 12:58 AM

    Thanks for ur help. Actually I use an image of apply now button on click I want to pop up this CV form which I have created.will u plz guide me.

  • Profile Image
    NeilVicente
    Answered on November 16, 2012 at 01:15 AM

    @guest_23200971566048

    First off, we recommend signing up for a JotForm account so you can easily log in and access your form from any browser or computer.

    As for your issue, you can have the lightbox pop-up from an image button by replacing the link text (from the lightbox codes) with an IMG tag pointing to your image's URL. The image must be uploaded on your web server.

    Here's an example:

    <script src="//www.jotform.me/min/g=feedback2" type="text/javascript">
    new JotformFeedback({
    formId:'23201119050435',
    base:'http://www.jotform.ne/',
    windowTitle:'CV Submission',
    background:'#FFA500',
    fontColor:'#FFFFFF',
    type:false,
    height:500,
    width:700
    });
    </script>
    <a class="lightbox-23201119050435"><img src="http://www.yourdomain.com/button-image.jpg"/></a>

    Simply replace the image URL above (in bold) with your button's URL.

    Let us know if you need further help with this.

  • Profile Image
    guest_23200971566048
    Answered on November 16, 2012 at 02:08 AM

    Thanks a lottt :-)