Jotform for Beginners
Get more done with powerful, easy-to-use online forms. Learn how in this helpful, free guide from Jotform.
Download the Book
This guide will show you how to use session cookies to automatically open a Jotform Lightbox when a user first visits your web page. To create this effect, you will need access to a PHP enabled web server.
- Create your form.
- Grab the Jotform Lightbox code for your form:
To find the Jotform Lightbox code for your form, please follow these steps:
- Click on the Publish tab.
- Select the LightBox option after clicking the Embed tab.
- Copy and paste this code somewhere safe such as an open notepad document. For this example, we are only interested in the codes enclosed in <script> tag.
- We need to make a small change to this code to automatically open the lightbox form; just change the openOnLoad parameter to true. It’s after the width set, and should look like this openOnLoad: true.
- Ok, now we are ready to transfer this code to your web page. Create a PHP file on your web server (as we are using PHP code to create this effect, your page will use the .php extension).
- On this page, we begin by adding some PHP that will check for a session cookie. If it doesn’t exist, it creates one and sets a variable that we will use later to know if we need to open our lightbox form. If it already exists nothing is done (i.e. no lightbox form will be displayed).
Note that when the browser window is closed, this cookie gets destroyed.
Add this code at the very start of your webpage:
<?php
$showlightbox=false;
if (!isset($_COOKIE[‘beenhere’])) {
// FIRST VISIT TO WEBPAGE THIS SESSION
setcookie(“beenhere”, true);
$showlightbox=true;
}
?>- Now, we just need to add one final bit of PHP and our lightbox embed code that we created earlier in step 3. At the end of our webpage, just before the closing body tag, add the following:
<?php
if($showlightbox){ ?>
<!–Your Lightbox code here… –>
<?php
}
?>This code, using the variable mentioned earlier, adds the lightbox code to our web page (and launches it) if no cookie was found.
This is a very basic example of a web page showing these pieces of the code in place:
<?php
$showlightbox=false;
if (!isset($_COOKIE[‘beenhere’])) {
// FIRST VISIT TO WEBPAGE THIS SESSION
setcookie(“beenhere”, true);
$showlightbox=true;
}
?>
<!DOCTYPE html>
<html>
<body>
<h1>Lorem ipsum dolor sit amet</h1>
<p>Consectetur adipiscing elit. Sed lectus turpis, aliquet a consectetur mollis</p>
<?php
if($showlightbox){ ?>
<script src =”https://form.jotform.com/static/feedback2.js” type=”text/javascript”></script>
<script type=”text/javascript”>
var JFL_203618479576065 = new JotformFeedback({
formId: ‘203618479576065’,
base: ‘https://form.jotform.com/’,
windowTitle: ‘Form’,
background: ‘#FFA500’,
fontColor: ‘#FFFFFF’,
type: ‘false’,
height: 500,
width: 700,
openOnLoad: true
});
</script>
<?php
}
?>
</body>
</html>Important
If you’re looking to create this effect on your own web page with your own form, you need to change the lightbox embed code to that of your own.
Send Comment:
10 Comments:
Added the code above but my page still shows the lightbox everytime it loads.
Here's my site:
Hi can you help with my popup form. I have loaded it to a test page it all looks fine with a delay to open, but every refresh of the page it still loads the form.
Hi , I tried the code as per instructions, however still appears each time page is refreshed within same browser session. can you my page to see if correct?
thanks
Is it possible to do this with my website, which was created using Weebly? If so, could you please provide instructions as to how to do it?
Thank you in advance for taking the time to answer.
Could you advise on how to get it to work within magento, the pop up part works fine having trouble with sessioncookie.php part. Thanks
Kindly let me know how can i use this to open a particular page of my site. I need same code to open my signup page once a day.
Thanks in advance.
Anil
What if you dont want the cookie to be destroyed in the code above... What do I need to change? and the lightbulb code works fine in Chrome but not in Internet explorer what could possibly be the problem?
Is there a solution for this that does not use php?
every thing fine working but its coming on every page,once we click home page also its coming
nice guide thanks. what if the page we'll put the code is an asp page?