In BlueConic, a Lightbox dialogue is a content overlay that lets you highlight information for your customers or visitors. A Lightbox grays out the webpage and displays highlighted content in a box to stand out. Your customer or visitor has to close the lightbox before proceeding.

Here's an example of a lightbox that asks for a customer's email address:

Learn more: Visit BlueConic University

Watch Creating a Lightbox Dialogue in the BlueConic University.

To create a new Lightbox dialogue, select Dialogues from the BlueConic navigation bar, click Add dialogue, and select "Lightbox" from the gallery. After creating the dialogue, open the What tab of your dialogue and navigate to the page where you want to add the lightbox. Click the Place on this page button to add the lightbox to the page:

You now see an empty lightbox, ready to be edited.

If you do not see the empty lightbox at first, try reloading the page to make it appear.

Lightboxes are very flexible, so to help you out we added some great templates to you get started. Click Load from Template in the Properties widget on the right, and you will get a gallery of starter templates:

You can edit existing templates by hovering over them and selecting the pen icon that appears, or you can design new templates with the Add new example button. In either case you are prompted to design the template using HTML, CSS, and JavaScript.

Select the template that fits your content best. The template is copied into your lightbox where you can now start editing like in the regular Text editor:

Note that the form is part of the content and can be edited as well! Click the field to modify the form.

The lightbox has categorized settings that can be selected from the settings pulldown menu in the Properties box on the right-hand side of the page:

These are the styling options:

These are the timing settings:

These are the appearance settings:

These are the close settings:

This is the JavaScript option:

This advanced settings option is relevant when you want to register conversions for the lightbox. In order to be able to register a conversion, BlueConic needs to register a click event first:

Note that there are several instances where you do not need to specify a click event selector. See the What tab documentation for Dialogues for details.

For tips on testing your dialogues with the BlueConic Simulator, see the video and tips in Testing Your Dialogues. Also see the troubleshooting dialogues section.