Trigger a Lightbox Web Form With a Link or Button

A lightbox is one way you can grab your visitors’ attention – it appears above your web page and shades everything else out.

We offer the lightbox as an option in our Web Form Generator. Once a page loads, the form installed on it appears above it. For some, this is great – a way to really catch the visitor off-guard with an offer to sign up for your email marketing campaign.


Well, one man’s treasure is another man’s “annoying pop-up”. Some just don’t like them and there’s no convincing. They don’t want something that appears unexpectedly.

Does this describe you? Then I wonder how you might feel about a lightbox that appears only when a visitor does expect it – and asks for it.

An Alternative to the Automatic Pop-Up

When we recently re-did the Web Form Generator, the project’s lead developer, Dan, unsurfaced a neat option. By copying and pasting in some JavaScript above your form, you can set a button or link to trigger the loading of a lightbox, thereby preventing some of the possible pains of pop-ups while preserving a lot of the good stuff.

Set Up Your Own Triggered Lightbox

          View the Knowledge Base Article

27 Comments

  1. Mical Johnson

    12/16/2009 4:24 pm

    Great tip Marc! I was wondering if something like that was possible. Now I know. I’ll have to get creative on the integration now 😉

  2. Yee Shun Jian

    12/17/2009 1:45 am

    Interesting… but everything requires testing… Let’s see if opt-in conversion rates improve with this…

  3. Cosmin

    12/17/2009 4:35 am

    Clicking outside of the pop-up doesn’t close it.

    That’s not too cool IMO, many people are used to doing so because of so many lightbox galleries on the internet.

    Maybe you should consider this in an update 🙂

  4. anonymous

    12/17/2009 10:26 am

    Why wouldn’t you just put the sign up form directly into the banner? That way they dont have to click to get to it. Every action a user is required to take decreases the conversion rate.

  5. Jason Anderson

    12/17/2009 10:59 am

    To "anonymous" above…

    It’s called testing.

    Personally I’m thrilled with the new easy options. You never know if it hurts or increases conversions until you test it out.

    You may want to consider that maybe the visitor may have never read the "benefit" statement if it were a form. If the benefit statement gets them to click the image…then it’s doing it’s job. Some people are conditioned to ignore forms unconsciously. The see the form and immediately think "that’s not the info I’m looking for" and don’t even scan the call to action in the form area itself. However, in the example above, since there is no form (just an image with text), the ONLY people who click that image are people who are interested. They may not have filled out a from previously…but now they may be inclined to.

    It’s all speculation.

    That’s why you test…

    That’s why I like the new feature.

  6. Marc Kline

    12/17/2009 11:20 am

    @Cosmin,

    We are doing just that :-). Thanks for the feedback!

    @anonymous,

    For some situations, a simple, small form does the trick. In other cases, our users create forms that take up much more space in order to lay out the merits of their newsletter.

    As you probably know, screen real estate can be expensive, so we present this as a solution: use a small banner to encourage a simple click, then show a larger lightbox to really convince the visitor to complete the form.

  7. Jen

    12/17/2009 11:27 am

    This would be perfect for some things I’d like to do, however, you can’t modify the raw html when you use a lightbox form type. Will this be an option in the future?

    If not, some advanced configuration and layout options in the creation proccess would be extremely useful.

  8. sean breslin

    12/17/2009 11:50 am

    Neat feature! saves buying the software.

  9. Teena Hughes

    12/17/2009 3:28 pm

    Oh I really like this idea!

    I’m going to set up a form and test it on a site which doesn’t have a sign-up form on every page.

    Thanks Aweber, you guys and gals rock!

  10. Teena Hughes

    12/17/2009 5:22 pm

    OK – I did it! The text link and new form only took about 10 minutes, so I decided to make a quick graphic and the result works beautifully! You can see it live on my site in the top right corner:

    http://www.abfabdesigns.com

    Thanks Aweber – I’ve been meaning to add a sign-up form to each page of this site for ages, rather than the menu item "Newsletter" which is easy to miss.

  11. Louisa Chan

    12/17/2009 8:15 pm

    Great new feature, thanks! – I am going to try this!

    Can we have control over where the box will appear?
    And the background color?

  12. Rachel Young

    12/18/2009 9:26 am

    Reasons like this new lightbox option are what drew me back to aweber. I love it! Another great idea! Keep em coming!

  13. Eruwan Gerry

    12/19/2009 8:51 am

    Simply a great new addition Marc! Some of my visitors got pissed off with the old option.

  14. John Bandy

    12/19/2009 4:54 pm

    This one is better than others I have seen that once activated you could not find an exit button and it covered most of the page. I would just delete the whole page and continue on. The way they were set up you had to give your name and e-mail address to contnue. I do not like to be forced into anything so I would just exit the entire page. With this Lightbox you have a choice. Thanks much for another great item.

  15. Marc Kline

    12/21/2009 2:16 pm

    @Jen,

    Is there something specific you’re looking to do that you aren’t able to in the feature? There’s a good chance we can help you to do it – just get in touch with our Customer Solutions team.

    @Louisa,

    The form always appears in the center with a semi-opaque black background (so that your site content is not distracting but still peeks through a bit). This isn’t customizable at the moment, but I have seen other lightbox variations (e.g. for images and other non-form content) with different color variations and will suggest this for consideration.

  16. John Grover

    12/26/2009 5:59 pm

    I like this one.

    Web visitors can get lost in all the images and text they are constantly having to digest. This blocks everything else out, and draws their attention to one thing – to sign up or not to sign up, that is the question?

    And since they initiated this step themselves, it is not just another annoying pop up.

    Brilliant idea!

  17. Ron Orr

    12/30/2009 2:48 am

    I just ran a test against all 4 options popup, popover, lightbox and inline and my lightbox pulled the highest conversion rate of all.

    for a squeeze page with very little I’d use it

    for a brochure type site, or one with frequent loyalty traffic maybe not, there are situations when it works great, the point of a squeeze page IMO is to get someone to focus on 1 thing, and the lightbox even makes it that more in focus, kind of like a big red arrow

  18. Dave Shillito

    1/3/2010 8:33 am

    Why did I stay with Get*esponse so long when you guys have neat gizmos-a-gogo

  19. Aaron

    2/22/2010 7:17 pm

    This is great…Curious, is there any way to activate the pop-up upon exiting the page instead of upon clicking a link?

    Many thanks!

  20. Christine

    3/30/2010 9:18 am

    Yes, my question is same as Aaron’s… and since I don’t see a reply to it here, I’ll ask it also.

    Is there any way to activate the pop-up upon exiting the page instead of upon clicking a link — or having choices for this ‘per page’ as another testing device?

  21. pembalut anion

    10/1/2010 9:06 am

    Yes, I have the same question as Aaron and Christine. Is there any way to activate the lightbox form upon exiting the page instead of upon clicking a link?

    I need the answer immediately.

  22. Amanda Gagnon

    10/1/2010 3:38 pm

    Pembalut, Aaron and Christine ~ If you use a pop-up form instead of a lightbox, you can set it to appear on exit.

  23. Jeff Lighthall

    1/9/2011 4:18 pm

    Is it possible to have the aWeber lightbox form to pop up over top of my FaceBook page like the Instant Sales System does?

  24. Amanda Gagnon

    1/10/2011 9:12 am

    Jeff ~ Facebook pages don’t work with the JavaScript used for our lightbox forms, but you can always use an inline form or link to a hosted form.

  25. N

    2/16/2011 12:39 am

    Your javascript based popup doesnt work on Joomla so as an alternative, I have tried linking to your hosted web form using several other lighboxes but it sux… RokBox, Pretty Photo, Lightbox and your hosted form just doesn’t work on standalone lightbox. All I get is a white overlay.

  26. Paul

    2/19/2011 9:03 am

    It works like a charm, thanks!

  27. Oz

    4/20/2012 11:32 am

    I can’t seem to make this work on my site. Do I need to change the code for the lightbox in Aweber?