Skip to main content

Hey all! Anyone know how to program in Javascript to create a 2-step optin process? I’m thinking where the form pops up in a lightbox after the user clicking a button, just like Leadpages does. I am willing to pay for it 🙂


Thanks,

Roy

Hey Roy!


We chatted today during Unbounce’s workshop, and there are a couple of options for you. I’ve opened up a support ticket so we can continue our conversation there. Check your email!


In the meantime, I’d love to hear from other people in the community - why is this feature so important to you? 


Thanks in advance for sharing, everyone!


Great, thanks Lou! I’ll check my email.


The reason for this two-step optin is that in many cases it increases the optin rate, because a user is more inclined to click a button if there is no other fields to enter data. And that first click is like a micro commitment which increases the chance of them adding their email etc at step two.


Hello Everyone,


I also have the same problem. Could you please help me? Can I get that mail also?🙂


Thnaks

Zigmond


Hi Zsigmond!


We have a couple options for this type of functionality. Check your email - I’ve opened up a support ticket for you so we can go into more detail!


In the meantime, I’d really encourage other Unbouncers in the community to take the time to share some insight - why is this feature important to your marketing campaigns? Have you seen lifts in your own conversion rates using this feature?


Thanks in advance everyone for sharing! 


I saw some code to do this on jmso01’s Gists, but they’re not working out for me. ÀIs there any tutorial to use the js online?


Hi Francisco - there’s a couple options available for you. Check your email shortly, I’m going to open up a Support ticket and see what is amiss!


Dear Lou, I haven’t yet received your e-mail. Please contact me when you can, we need to fix this as soon as possible.


Best regards,


Francisco


Hi Francisco - please check your email again, I’ve sent the info your way!


I would like to do the same. Can you send me the info via email? Thanks!


I would also like this feature. It makes designing forms so much easier as you don’t have to have an ugly from on the page and leaves space to keep the design cleaner and more functional.


Has anyone come up with a solution yet?


Thanks


I am also interested in a solution to this.


Lou, could you share the options you have been alluding to?


Thanks,

Mike


Hey Michael


I detailed below some instructions for creating a form lightbox on Unbounce. You can find the script and guide below:


https://gist.github.com/johnnyopao/ee58344410873e6c7406


Johnny,


That is absolutely fantastic.


Thank-you!


Mike


Hi Jonny,


That words great thanks except for on my phone (Samsung galaxy s2) when you click the ‘sign up’ button the form doesn’t appear. See here:


http://unbouncepages.com/30-day-free-…


I have the form centered in the mobile view.


Your example http://unbouncepages.com/lightbox-form/


works fine so I’m doing something wrong somewhere


Thanks


Masten


Hi Masten, 


While I’m not entirely sure why this isn’t working on your phone, I will _escalate this to my technical team so they can dig in and hopefully find a solution. Hang tight and I’ll send you an email to follow up.


Jonny,


Is there a way to trigger the lightbox container automatically (rather than having to click on a button)?


Mike


Hi Johnny,


it works great, except I have multiple buttons (which cannot have the same ID) that should trigger the same form. What do I have to change in order for this setup to work?


Thanks.


Hey Michael - You could try a timeout delay that simulates a button click after a certain period of time.


$(function(){
<br />
window.setTimeout(function(){
<br />
$('#lp-pom-button-14').click(); <br />
},2000); <br />
}); <br /> </script>```

With #lp-pom-button-14 replaced with your buttons ID that is used to open the lightbox

Hey Erik!


Simply change the variable ‘buttonToTriggerForm’ to include more than one button ID separated commas. For example:


var buttonToTriggerForm = '#lp-pom-button-209, #lp-pom-button-210, #lp-pom-button-211';

Is it not possible to scroll within the lightbox on iPhones? We’re having some issues.


Desktop works great, though, thanks Johnny! 


Hey Cheryl


The way I made it is that it will display the full content without needing to scroll. I’d like to see your setup so I can take a closer look and perhaps provide some suggestions.


I’m sending you a email now. Lookout for it shortly!


I put a html widget in box instead of form widget, and applied a lightbox effect to multiple buttons. When I click on any button first time, html content appears. But when I click on another button, html widget doesn’t appears. What can be a problem?


Hey Mirus


Let me take a closer look. I’ll shoot you a email shorty so we can dig in together. Lookout for my email!


Hey there - It looks like there was some cropping issues with longer content on mobile. I’ve made some adjustments to the script to prevent this


I too have multiple buttons, but need different pop ups for each button (3). When I just add one it works. But when I add a second or third, it doesn’t.


Reply