# Exit-Intent Popup

> Shows a popup with your offer or newsletter link when a desktop visitor moves the mouse toward closing the tab, at most once every 30 days.

- Type: HTML
- Runs: Site-wide footer
- Category: [Frontend & Design](https://wpide.com/library/category/frontend/)
- Tags: popup, exit-intent, newsletter, conversion
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/frontend-exit-intent-popup/

## Code

```html
<div id="wpide-exit" hidden role="dialog" aria-modal="true" aria-labelledby="wpide-exit-title" style="position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.6);">
    <div style="position:relative;max-width:440px;width:100%;padding:32px 28px;border-radius:10px;background:#fff;color:#1e1e1e;text-align:center;">
        <button type="button" data-close aria-label="Close" style="position:absolute;top:8px;right:12px;border:0;background:none;font-size:26px;line-height:1;cursor:pointer;">&times;</button>
        <h2 id="wpide-exit-title" style="margin-top:0;">Before you go...</h2>
        <p>Get 10% off your first order when you join our newsletter.</p>
        <p style="margin-bottom:0;"><a class="wp-element-button button" href="/newsletter/">Get my discount</a></p>
    </div>
</div>
<script>
(function () {
    var box = document.getElementById('wpide-exit'), days = 30, key = 'wpide-exit-shown';
    if (!box || window.matchMedia('(pointer: coarse)').matches) { return; }
    try { var last = parseInt(localStorage.getItem(key), 10); if (last && Date.now() - last < days * 86400000) { return; } } catch (e) {}
    function show() {
        document.removeEventListener('mouseout', onOut);
        box.hidden = false;
        try { localStorage.setItem(key, String(Date.now())); } catch (e) {}
    }
    function onOut(e) { if (!e.relatedTarget && e.clientY <= 0) { show(); } }
    setTimeout(function () { document.addEventListener('mouseout', onOut); }, 5000);
    box.addEventListener('click', function (e) { if (e.target === box || e.target.hasAttribute('data-close')) { box.hidden = true; } });
    document.addEventListener('keydown', function (e) { if (e.key === 'Escape') { box.hidden = true; } });
})();
</script>
```

## Notes

Edit the heading, text and link. Change the 30 in the script to show it more or less often.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Exit-Intent Popup" in its snippet library and add it in one click; or create a new HTML snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/