Studio Editor: Using Lightboxes
A lightbox is a pop-up that you can customize to your needs. Design the pop-up window and add the elements you want, then choose when it appears to site visitors.You can also link elements, like text, buttons or images, so clicking them opens the lightbox. This is a great way to increase the exposure for time sensitive information, sales or promotions.In this article, learn how to:
Add a lightbox Customize a lightbox Set triggers for a lightbox Scheduling a lightbox Link elements to a lightbox Manage a lightboxAdding a lightboxAdd a lightbox pop-up to your site so you can start setting up exciting announcements for visitors to see.To add a lightbox:
Click Add Elements  on the left side of the Editor. Click Layout Tools. Click Lightboxes. Select the lightbox you want to add. Customizing a lightboxCustomize the lightbox to match the rest of the site. Add any elements you need, then change the background color and decide on its opacity.To customize a lightbox:
Click Pages  on the left side of the editor. Select the relevant lightbox under Lightboxes. Click the lightbox on the canvas. Choose how to customize the lightbox:Add elements
Click Add Elements  on the left side of the editor.  Drag and drop the relevant element. Note: The following elements can't be added to a lightbox:
Any section from the Sections or Quick Add tabs. Pre-designed sections you've saved in My Designs. Section grids Slideshow repeaters WireframesDesign the background
Click the Open Inspector icon  at the top right of the editor.

 Scroll down to Design. Choose a color and set the background opacity under Background.Add the option to scroll inside the lightbox
Click the Open Inspector icon  at the top right of the editor. 
 Scroll down to Layout. Select Scroll under Overflow content. Choose the Scroll direction: Vertical, Horizontal or Both.Set up the overlay around the lightboxBy default, a black overlay appears around the lightbox to help visitors focus on the content in the pop-up. Do any of the following to customize the overlay:
Click Set Overlay to enable or disable the option to close the lightbox by clicking anywhere on the overlay. Click anywhere on the overlay and open the Inspector panel to set the color and opacity.
Tip: To remove the overlay altogether, set the opacity to 0%. 5.  When ready, click Done at the bottom to exit Editing mode. What's next?Preview the site to see the lightbox in action.Setting triggers for a lightboxChoose how and when the lightbox appears. You can set it to appear automatically on specific site pages or link it to an element (e.g. text, image). You can also decide how visitors close the lightbox after viewing it.Note:The lightbox is displayed once per visitor, on the first relevant page they see (in case it's set to appear on multiple pages).To set up triggers:
Click Pages  on the left side of the Editor. Select the relevant lightbox under Lightboxes.  Click the lightbox on the canvas. Click Set Triggers. Select the relevant option under Automatically display lightbox on Pages:
    
Yes: The lightbox automatically appears when visitors enter the relevant pages.
        
Click under Which pages is it on? to select the relevant page(s). Drag the Delay slider to set how long (in seconds) it takes the lightbox to appear once the page loads.      No: The lightbox does not appear when visitors enter a page. Instead, it's triggered by a button or a link you choose.    Enable the relevant toggle(s) under How does the lightbox close?.
Note: If you disable both the 'X' icon and 'Close' button, visitors can click outside of the lightbox to close it. When ready, click Done to exit Editing mode.  Setting a schedule for a lightboxChoose when site visitors see the lightbox. If you're promoting a limited-time offer, for example, this ensures the lightbox only appears in the relevant time frame.To set the lightbox schedule:
Click Pages  on the left side of the editor. Select the relevant lightbox under Lightboxes.  Click the lightbox on the canvas. Click Set Triggers. Scroll down to Lightbox scheduling and click + Set schedule. Set the start date and time and the end date and time.
Tip: Make sure the correct time zone is set. If not, you can change it. Linking elements to a lightboxLink elements on the site to open a lightbox, so visitors never miss an announcement. You can link elements like text, images, videos and buttons. To link an element to a lightbox:
Click the relevant element in your editor. Click the Link icon . Select Lightbox on the left. Click the Which Lightbox? drop-down and select the relevant lightbox. Click Done.Managing a lightboxManage the site's lightboxes to keep them organized in the Editor. You can rename them so they are easy to find, duplicate them to save time and delete any outdated lightboxes.To manage a lightbox:
Click Pages  on the left side of the editor. Click the More Actions icon  next to the relevant lightbox. Choose what to do next:Rename a lightbox
Click Rename.  Enter a new name for your lightbox.Duplicate a lightbox
Click Duplicate Lightbox. Enter a name for your new lightbox. (Optional) Set up the lightbox triggers and customize the design. Delete a lightbox
Click Delete. Click Delete in the pop-up to confirm.Note: Deleting a lightbox removes it completely from your site.