Launching a Lightbox
Edited

Once you're done building and styling your Lightbox unit with Jebbit, you will move on to configuring your launch settings to get the pop-up experience on your site! If you have not yet built your Lightbox, follow this guide here.


Video Tutorial

Step by Step Guide

  1. When you are ready to launch your Lightbox experience, click the 'Launch' tab at the top of your builder map.

  2. You will be brought into 'Lightbox' launch page directly, which is a tab within the 'Website' menu on the left. In the Lightbox menu, you will find under Preferences the following launching options:

    - If you want your Lightbox to appear when the designated page(s) on your website load, then you will select "Page Load."

    - If you want your Lightbox to appear based on specific actions then you will select "Action Based" and then customize the specific action based triggers that you want.

  1. By default, the Lightbox will trigger once per visitor on site. You can set it to "Trigger at Most" to adjust the number of times the Lightbox will deploy per visit. You can also select whether you want your Lightbox to be shown for all site visitors, or only for mobile traffic or desktop traffic.

  2. Select whether you want to use the standard Jebbit privacy URL, add your own privacy URL, or not show it.


  3. To display your Lightbox from any page on your site, select "All Pages"

  4. To show your Lightbox on specific URLs, then select "Specific URLs" and continue to steps 10 and 11

  5. Most commonly, users list individual URLs on this step and use the "ANY conditions match (or)" setting

  6. You can use the "ALL conditions match (and)" setting but it's less common. In this scenario, Jebbit will verify if the page URL contains every rule criteria, and then only show your Lightbox in that instance

  7. Once you have the launch settings configured. In order for a Jebbit Lightbox to appear on your site, you will need to add Jebbit's global code snippet to your site. Click on your brand name in the top right corner and select 'Settings' from the menu.


  8. Select "Onsite Deployment" from the left hand menu and the snippet that you will need to add to your site will be found at the top of the page. Embed this code directly on site or through a Tag Manager.

  9. The final step in the Launch process is enabling your Lightbox. Navigate to your Workbench, hover your mouse over the Lightbox tile, click on the three dot menu that appears in the top right corner, and select 'Enable' from the list.


Frequently Asked Questions

Q: Where should I place the Global Snippet Code on my site?

A: The snippet must be placed on any page where you would like to launch Lightbox. For example, if you'll be launching just on the home page, add it to the <head> or <body> of the home page. But if you want more flexibility, adding the snippet globally (which means adding it to the <head> tag in most cases) will allow you to launch on any page.

Q: Can I combine settings from Step 1 on the launch page?

A: You can combine some of the options from Step 1 on the Lightbox launching page to work together; for instance, you can set both delay of appearance and scroll depth to have your Lightbox tigger 5 seconds after a user has scrolled 25%.

Q: Can I launch Lightbox when users click on a button on site?
A: One of the Action Based rules that you can set is triggering your Lightbox through a button click. This is the "On Click" option within the Action Based settings. Watch the following video to see how it's done!

You can add a new button to your site that will trigger your Lightbox, or you can set up a trigger on an existing button:

  • New button: Copy the code snippet and paste onto the portion of your website where you want it to display. This will add a brand new button to your site. Note that you may want to update the styling of the button.

  • Existing button: Copy the snippet and add it to an existing button (or one you create on your own).

The snippet would be an attribute added to the opening tag of the element. So your code would look like the example below:

<button data-jebbit-start-experience type="submit" class="Form__Submit Button Button-primary">Check it out!</button> 

Q: How does UTM Tracking work with Lightbox units?
A: Because Lightbox units are not deployed through a standard url or iframe, we don't support UTM tracking with Lightbox units.

Related Articles


Keywords lightbox, pop-up, pop up, onsite, website, launchi