Skip to main content
Skip table of contents

Using the Overlay Editor

The overlay editor lets you design pop-ups, banners, sliders, and embedded boxes for your website. Control the look and feel of your boxes, add forms, buttons, text, images, and even custom HTML.

Main Page

The main page is the first page that appears on your Lightbox. After a form is submitted the user can then be brought to a Thank You page. You can also create multi-step lightboxes with Extra Pages.

Layout

The Layout tab is where you edit the box’s dimensions, border, and background. You can also set your box to be responsive in this tab.

change box size in the drag-and-drop pop-up editor

Form

Under the Form tab, you can add fields, style the labels and inputs.

edit the styles of each form field

Here are the sections in the Form tab:

  • Form: Turn the form on/off and choose the action that happens after the form is submitted.

  • Fields: Add and edit fields from the dropdown. Create custom fields and set them to Text Box, Dropdowns, Checkboxes, Radio Buttons, etc.

  • Labels: Show/hide labels that appear above or in front of your fields.

  • Inputs: Control the height, spacing, font, border, and background of your form inputs.

Buttons

Add form submission buttons, download buttons, close buttons, and more in the Buttons tab.

drag-and-drop to move and resize form buttons

Drag and drop or resize buttons using the editor. You can also change colors or use an image as a button.

Program buttons by setting the click action to:

set form buttons to submit, close pop-ups, redirect, or show another page
  • Submit Form

  • Close Lightbox

  • Redirect to Website

  • Do Nothing (so you can add custom JavaScript)

  • Download File

  • Open Another Lightbox

  • Show Thank You Page or Extra Pages*

*If you choose to make a button show another page, it won’t submit the form. To show the Thank You Page after a user submits the form, you must go to the Form tab, and set After Form Submit to Show Thank You Page.

Text

Edit text, font face, size, alignment, and even add custom CSS. You can also upload your own custom fonts.

enter text in the form editor and style it with custom fonts and colors

Images

Use the Images tab to add images, then control their size and position.

add images to Digioh pop-ups

HTML

Add custom HTML blocks for even more control over your design.

add custom HTML to your pop-ups

Thank You Page

To display a Thank You Page, set your button or form to Show Thank You Page. The Thank You Page has the same options as the Main Page.

1. To copy the style settings from the Main Page, go to Layout and choose Main Page from the Copy Design Settings From Section, then hit the Copy button.

2. Next, edit your text and turn off any forms or buttons not required for the Thank You Page.

add a thank you page to your pop-ups and lightboxes

3. Save and Preview to see how your box will look.

save and preview your lightbox on a blank site

4. If everything looks good, publish your box by clicking on Save & Publish.

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.