---
title: "How to close Elementor Popup with the Esc button or by clicking outside?"
url: https://theplusaddons.com/docs/close-elementor-popup-with-esc-or-clicking-outside/
date: 2023-02-09
modified: 2026-09-11
lang: en
author: "Aditya Sharma"
description: "How should visitors close your popup? The Popup Builder widget in The Plus Addons for Elementor gives them five ways, and four of them are on already. This guide shows..."
image: https://theplusaddons.com/wp-content/uploads/2020/10/How-to-close-Elementor-Popup-with-the-Esc-button-or-by-clicking-outside_-1024x536.jpg
word_count: 546
---

# How to close Elementor Popup with the Esc button or by clicking outside?

## 

- Popup Builder en The Plus Addons for Elementor ofrece cinco formas de cerrar un popup, y cuatro están activadas por defecto: Esc Button Close Content, Outer Click Close Content, On Click Link Popup Close y Display Close Icon.
- Content > Extra Options controla Esc Button Close Content, Outer Click Close Content y On Click Link Popup Close, mientras que Style > Open Content controla Display Close Icon y permite usar Custom Close Icon.
- Unique Class (Close) cierra o abre el popup desde otro elemento: el botón recibe una clase en Advanced > CSS Classes, y Popup Builder usa esa clase en Content > Display Options con On Any Other Element's Click.

How should visitors close your popup? The Popup Builder widget in The Plus Addons for Elementor gives them five ways, and four of them are on already.

This guide shows each one, how to switch it off, and how to close the popup from your own button.

*To check the complete feature overview documentation of The Plus Addons for Elementor Popup Builder widget, [click here](https://theplusaddons.com/docs/popup-builder-elementor-widget-settings-overview/).*

***Requirement - This widget is a part of The Plus Addons for Elementor, make sure it's installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-builder/popup-builder/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

## Before You Start

- **Edition:** **Pro** — the Popup Builder widget is part of The Plus Addons for Elementor Pro. It does not appear in the widget panel of the free plugin.- **Widget to enable:** Popup Builder, switched on under **ThePlus Settings > Widgets**.

## The ways a popup can close

| Method | Setting | Where | Default |
| ------ | ------- | ----- | ------- |
| Press Esc | Esc Button Close Content | Content > Extra Options | On |
| Click outside the popup | Outer Click Close Content | Content > Extra Options | On |
| Click a link inside the popup | On Click Link Popup Close | Content > Extra Options | On |
| Click the close icon | Display Close Icon | Style > Open Content | On |
| Click your own element | Unique Class (Close) | Content > Display Options | Off |

## Step 1: Check the Extra Options switches

Select the **Popup Builder** widget and open **Content > Extra Options**. **Esc Button Close Content** and **Outer Click Close Content** are the first two switches.

![The Esc Button Close Content switch in Content > Extra Options](https://theplusaddons.com/wp-content/uploads/2026/09/tp-off-canvas-esc-button-close-content-wide-extra.webp)

![The Outer Click Close Content switch in Content > Extra Options](https://theplusaddons.com/wp-content/uploads/2026/09/tp-off-canvas-outer-click-close-content-wide-extra.webp)

Leave them on for offers and forms, so visitors are never trapped. Turn them off for a menu or an age check that must be answered.

## Step 2: Decide about links

**On Click Link Popup Close** closes the popup when any link inside it is clicked. Keep it on for menus. Turn it off if the popup has links that should keep it open.

![The On Click Link Popup Close switch in Content > Extra Options](https://theplusaddons.com/wp-content/uploads/2026/09/tp-off-canvas-on-click-link-popup-close-wide-extra.webp)

## Step 3: Hide or replace the close icon

On the **Style** tab, **Open Content** holds the **Close Icon** settings. Switch off **Display Close Icon** to remove it, or turn on **Custom Close Icon** to use your own image.

![The Close Icon settings in Style > Open Content](https://theplusaddons.com/wp-content/uploads/2026/09/tp-off-canvas-display-close-icon-wide-style.webp)

## Close from your own button

To close the popup from a button inside it:

- Select the button, go to **Advanced > CSS Classes** and add a class such as `close-offer`.- Select the Popup Builder, open **Content > Display Options**, switch on **On Any Other Element's Click** and enter `close-offer` in **Unique Class (Close)** — without the dot.

> *The Unique Class (Close) element **toggles** the popup: it closes an open popup, and opens a closed one. Place it inside the popup so it can only ever close it.*

## Limitations

- **Pro only.** The Popup Builder is not in the free plugin.- **Outside-click needs an outside.** A popup that fills the whole screen has no outside to click; give it a close icon or button.

## Troubleshooting

### The close button does not work

Test on the published page. If you use your own button, check the class in Unique Class (Close) matches the one in Advanced > CSS Classes exactly, without a dot.

### The popup closes when I click a link inside it

Turn off **On Click Link Popup Close**.

### Visitors cannot close it at all

Esc, outer click and the close icon are all switched off. Turn at least one back on.

## Related Docs

- [Popup Builder widget: settings overview](https://theplusaddons.com/docs/popup-builder-elementor-widget-settings-overview/) — every control in the widget.- [Open or close a popup from any element](https://theplusaddons.com/docs/elementor-popup-on-other-element-click/)- [Show a popup only once per visitor](https://theplusaddons.com/docs/elementor-popup-once-per-website-session/)- [Create an off-canvas popup menu](https://theplusaddons.com/docs/off-canvas-popup-menu-in-elementor/)

## Frequently Asked Questions

**Q: Why won’t an Elementor popup close when I click the close button?**
A: The first thing to check is whether the popup is being tested on the published page, because that is where the close behavior should be verified. If you are using your own button, the class in Advanced > CSS Classes has to match the value in Unique Class (Close) exactly, and it must be entered without the dot. The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH uses that class to toggle the popup state.

**Q: How do I stop a popup from closing when visitors click a link inside it?**
A: Turn off On Click Link Popup Close in Content > Extra Options. That setting is what makes any link inside the popup close it, which is useful for menus but annoying for popups that contain links meant to keep the visitor inside. The practical rule is simple: leave it on for navigation-style popups, and switch it off when links are part of the content flow.

**Q: What is the best way to let visitors close a popup with Esc or by clicking outside?**
A: Esc Button Close Content and Outer Click Close Content are the two settings that control those behaviors in Content > Extra Options. Leaving them on makes offers and forms less frustrating because visitors are never trapped, while turning them off makes sense for popups like menus or age checks that need a more deliberate exit. The Plus Addons for Elementor gives you both options so you can match the popup to the job.

**Q: Can I close an Elementor popup from my own button or link?**
A: The Popup Builder widget supports closing from your own element by using a CSS class and Unique Class (Close). Add a class such as close-offer in Advanced > CSS Classes, then enter that same class in Content > Display Options under Unique Class (Close), without the dot. This setup toggles the popup, so it closes an open popup and opens a closed one, which is why it has to live inside the popup if you want it to act only as a closer.

**Q: Why does clicking outside not close my Elementor popup?**
A: Outside-click only works when there is actually an outside area to click. If the popup fills the whole screen, there is no outside space available, so Outer Click Close Content cannot do anything useful. In that case, give visitors a close icon or a button instead. That limitation matters most for full-screen layouts where escape behavior needs another exit path.

**Q: What settings should I change if I want a menu-style popup instead of an offer popup?**
A: Menu-style popups usually need stricter closing rules than offers or forms. Turn off Esc Button Close Content and Outer Click Close Content if you want visitors to make an intentional choice, and keep On Click Link Popup Close on so navigation links can dismiss the popup naturally. If you also hide the default close icon with Display Close Icon off, make sure another exit exists or people can get stuck.