---
title: "How to Add a Popup in WordPress?"
url: https://nexterwp.com/docs/add-popup-builder-in-wordpress/
date: 2023-02-06
modified: 2026-09-14
lang: en
author: "Aditya Sharma"
description: "A message nobody sees does no work, and a popup everybody sees at the wrong moment does worse than none. The Popup Builder block gives you the panel and eleven..."
image: https://nexterwp.com/wp-content/uploads/2024/05/popup-builder-block-settings-overview-1024x519.jpg
word_count: 674
---

# How to Add a Popup in WordPress?

## Key Takeaways

- Popup Builder block is part of Nexter Blocks Pro and is switched on under Nexter > Blocks in the WordPress dashboard.
- Popup Builder block offers five popup types: Popup, Slide, Push Content, Slide Along Content, and Corner Box.
- Popup Builder block uses eleven display conditions, including On Button Click, On Page Load, On Scroll, Exit Intent, Based on URL Parameter, and Show For Specific Time.
- Popup Builder block closes by default with Esc or a click outside, and Based on URL Parameter plus Show For Specific Time are decided on the server.

A message nobody sees does no work, and a popup everybody sees at the wrong moment does worse than none.

The Popup Builder block gives you the panel and eleven conditions that decide exactly when it appears.

[LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/builder/wordpress-popup-builder/)

## Before You Start

- **Edition:** **Pro** — the Popup Builder block is part of Nexter Blocks Pro.- **Block to enable:** Popup Builder, switched on under **Nexter > Blocks** in your WordPress dashboard.- **The popup's content decided:** a short message, a form, or a saved pattern to load into it.

## Learn via Video Tutorial

https://www.youtube.com/watch?v=1DKVWDXY2IQ&t=322s

## Steps

- Add the **Popup Builder** block to your page and click **Design from Scratch**.

- In the **Content** panel, choose a **Type** and set the popup's size.

![The Content panel with the Type setting](https://nexterwp.com/wp-content/uploads/2026/09/popup-builder-type.webp)

- Set **Content Type** and add what the popup should show.

![The Content Type setting with Pattern, Content, Editor and Shortcode](https://nexterwp.com/wp-content/uploads/2026/09/popup-builder-content-type.webp)

- In **Popup Load Settings**, set the **Button Text** and icon for the toggle button, if you are using one.

![The Popup Load Settings panel with Button Text](https://nexterwp.com/wp-content/uploads/2026/09/popup-builder-button.webp)

- Open **Display Conditions** and switch on the conditions that should open the popup.

![The Display Conditions panel with its switches](https://nexterwp.com/wp-content/uploads/2026/09/popup-builder-conditions.webp)

- Publish the page and check the popup on the front end.

## The Five Popup Types

| Type | What it does |
| ---- | ------------ |
| Popup | A standard modal over the page |
| Slide | A panel that slides in from the side you choose |
| Push Content | A panel that pushes the page across instead of covering it |
| Slide Along Content | A panel that slides in alongside the page content |
| Corner Box | A small box anchored in a corner |

## The Eleven Display Conditions

| Condition | When the popup opens |
| --------- | -------------------- |
| On Button Click | The visitor clicks the block's own toggle button |
| On Page Load | As soon as the page loads, after the delay you set |
| On Scroll | Once the visitor scrolls past the offset you set |
| Exit Intent | When the cursor moves as if leaving the page |
| After Inactivity | After a set number of seconds with no activity |
| After X Page Views | After the visitor has seen a number of pages |
| Arriving From Specific URL | Only for visitors who came from a page you name |
| On Any Other Element's Click | When any element matching your selector is clicked |
| Based on URL Parameter | Only when the address carries a parameter you name |
| Show For Specific Time | Only between the dates you set |
| Show X Times per User | Limits how often the same visitor sees it |

> *A popup can have more than one display condition switched on at once. Leave **On Button Click** on only if you also want the button to open it.*

## What Each Panel Controls

| Panel | What you set there |
| ----- | ------------------ |
| Content | Type, size, position, and where the popup's content comes from |
| Popup Load Settings | The toggle button: its text, icon, spacing and alignment |
| Display Conditions | The eleven switches that decide when the popup opens |
| Extra Options | The open animation, and whether Esc or a click outside closes it |

## How It Behaves

- Most conditions are handled in the browser: the block writes them into the page and its script watches for the right moment.- Two are different. **Based on URL Parameter** and **Show For Specific Time** are decided on the server, so when they do not match, the popup is not put on the page at all.- By default a popup closes when the visitor presses **Esc** or clicks outside it — both verified, and both can be switched off.- Several conditions can be on together, and any one of them opens the popup.

## Limitations

- **Pro only.**- Because two conditions are decided on the server, testing them means loading the real published address — the block is simply absent otherwise, which looks like a fault but is not.- A popup is content on your page, so an aggressive one hurts the visit more than it helps.- Conditions are per block. Two popups on a page each need their own settings.

## Troubleshooting

### The popup never appears

Check **Display Conditions**: if every switch is off, nothing can open it. If you are using **Based on URL Parameter** or **Show For Specific Time**, the block only renders when the condition matches.

### It opens immediately when I did not want it to

**On Page Load** is probably still on. Switch it off and leave only the condition you want.

### The block is missing from the inserter

Switch **Popup Builder** on under **Nexter > Blocks** in your dashboard.

![Popup Builder switched on in the Nexter Blocks list](https://nexterwp.com/wp-content/uploads/2026/09/popup-builder-admin-enable.webp)

## Related Docs

- [Open a popup on button click](https://nexterwp.com/docs/open-popup-on-button-click/)- [Trigger a popup on page load](https://nexterwp.com/docs/trigger-popup-on-page-load-wordpress/)- [Close a popup with Esc or by clicking outside](https://nexterwp.com/docs/close-popup-with-esc-or-clicking-outside/)

## Frequently Asked Questions

**Q: Why is my WordPress popup not showing up on the page?**
A: The usual cause is that no display condition is active, so nothing is allowed to open the popup. Nexter Blocks Pro handles the popup through the Popup Builder block, and conditions like On Page Load, On Scroll, Exit Intent, or On Button Click decide when it appears. If you use Based on URL Parameter or Show For Specific Time, the block only renders when that condition matches on the published page.

**Q: How do I stop a popup from opening immediately on page load?**
A: On Page Load is the condition that makes a popup appear as soon as the page loads after your delay. If it opens too early, that switch is still on. Keep only the trigger you actually want, because multiple conditions can be active at once and any one of them can open the popup. That matters when you want a button click or scroll trigger instead of an automatic modal.

**Q: What do I need before adding a popup in WordPress with Nexter?**
A: The Popup Builder block is part of Nexter Blocks Pro, so Pro is required. It also has to be switched on under Nexter > Blocks in your WordPress dashboard before it appears in the inserter. The popup content can be a short message, a form, or a saved pattern, so decide that first if you want the setup to stay clean.

**Q: Can I use one popup for both a button click and an automatic trigger?**
A: The Popup Builder block supports multiple display conditions at once, so one popup can open from more than one trigger. That means you can keep On Button Click active and also add something like On Scroll or Exit Intent. The practical catch is that any enabled condition can fire it, so leave On Button Click on only if you also want the toggle button to open it.

**Q: What are the different popup types in Nexter Blocks?**
A: Nexter Blocks offers five popup types: Popup, Slide, Push Content, Slide Along Content, and Corner Box. Popup is a standard modal over the page, Slide comes in from one side, Push Content shifts the page across instead of covering it, Slide Along Content moves beside the page content, and Corner Box stays anchored in a corner. That choice affects how intrusive the popup feels.

**Q: How do I close a WordPress popup with Esc or by clicking outside?**
A: Extra Options controls whether Esc and outside clicks close the popup. By default both behaviors are enabled and both are verified, which makes dismissing the popup easy for visitors who do not want to hunt for a close control. If you turn either off, keep in mind that closing becomes more deliberate and can change how aggressive the popup feels.