Popup is one of the features offered by Elementor. With this feature, you can create a beautiful popup on your WordPress-based site easily without neither coding nor installing an additional plugin. You can create a popup to display a banner, form, a call-to-action button or even navigation menu. In order to direct your visitors’ attention to the content you display on the popup, you might want to display the popup in a full-screen mode.
The popup builder feature of Elementor allows you to set the popup in a full-screen mode. But if you are a new Elementor user, you might face a bit problem to find the setting location. This post will show you where it is.
How to create a full-screen popup in WordPress with Elementor
Before getting started, please take note that the popup builder feature of Elementor is only available on the pro version (Read: Elementor Free vs Elementor Pro). Elementor provides ready-to-use popup templates so you can have a beautiful popup in minutes. Of course, you can also create your popup from scratch if you prefer to this.
To create a popup in Elementor, login to your WordPress dashboard and go to Templates -> Popups.
On the Popups page, click the Add New button to create a new popup.
Give your popup a name and click the CREATE TEMPLATE button to start creating the popup.
You can either select one of the popup templates offered by Elementor or create from scratch instead. If you want to create the popup from scratch, you can simply close the library. In this example, we will use the following template.
The popup template above is not a full-screen popup. We will edit it and turn it into a full-screen popup.
Once the template is loaded, click/activate the popup section on the Navigator panel.
Switch to the panel on the left side and click the Layout tab. Change the Content Width option to Full Width and Height to Fit To Screen.
Now click the gear icon on the bottom-left corner on the left panel to open the popup settings. On the Layout section under the Settings tab, change the width unit from PX to VW and set the value to 100. Also change the Height option to Fit To Screen.
Since your popup will show up in a full-screen mode, you might also want to add a close button. To do so, scroll down to the Close Button section and make sure this option is enabled (SHOW)
To customize the close button, go to the Style tab. You can customize the button like changing the size and color as well as set the position on the Close Button section.
Once done editing the popup, you can click the PUBLISH button on the left panel to publish your popup.
Final words
If you are new to Elementor and still use the free version, we strongly recommend you to upgrade to the premium version. In addition to features like popup builder and theme builder, there are many other benefits you will get. You can read the Elementor review we wrote to find out the features available on the pro version of Elementor.