Documentation

All the information you need in one place

How to Set Up Popup Size in Nelio Popups

Nelio Popups allows you to set different sizes to popups.

When you are ready to set the size of a popup, follow these steps:

  1. Go to Nelio Popups » All Popups and edit the one you want.
  2. In the editor sidebar, go to the Settings panel, and open the Style tab.

There you will find a size selector with several options. Let’s review them here.

Auto

Nelio Popups allows you to set different responsive sizes relative to the surrounding screen window. Once selected, you have 5 different values for the width of the popup: tiny, small, medium, normal and large.

Settings to display a popup with auto size.
Settings to display a popup with auto size.

Here’s a preview of the different sizes for the ‘Auto’ option:

Popup with tiny size.
Popup with tiny size.
Popup with small size.
Popup with small size.
Popup with medium size.
Popup with medium size.
Popup with normal size.
Popup with normal size.
Popup with large size.
Popup with large size.

Custom Size

Nelio Popups makes it easy to create popups with custom sizes. Just select the ‘Custom Size’ option in the Size selector.

Settings to display a popup with custom size.
Settings to display a popup with custom size.

Then, you can set the width of the popup in the units you want (percentage, pixels, em and rem). There is a toggle to indicate a custom height. Once active, you can set the custom height in the same way you set the custom width.

In addition to it, in case your content overflows the custom height, you can allow the popup to scroll the content by activating the ‘Allow scroll in a popup content’.

Fullscreen

Nelio Popups makes it easy to create a Fullscreen popup to capture your visitor’s attention. Just select the ‘Fullscreen’ option in the Size selector.

Popup size set to fullscreen.
Popup size set to fullscreen.

Fullscreen popups will cover the complete viewport of your visitors.

Preview of a fullscreen popup.
Preview of a fullscreen popup.

Note that you can always preview your popup by clicking the Preview link on the top right corner.

After setting the size you want, save the popup and then it will open with that size.