Skip to content

Instantly share code, notes, and snippets.

@cliffordp
Last active March 6, 2026 18:11
Show Gist options
  • Select an option

  • Save cliffordp/a1a256ccc27908ca585772593117dca7 to your computer and use it in GitHub Desktop.

Select an option

Save cliffordp/a1a256ccc27908ca585772593117dca7 to your computer and use it in GitHub Desktop.
GeneratePress Overlay Panel Triggered by Custom JS Event (https://generate.support/topic/site-wide-trigger-of-an-overlay/)
document.addEventListener("click", (event) => {
const link = event.target.closest("a");
const href = link?.getAttribute("href");
// trigger on click of ANY element type that has this class (even if not a link)
let shouldIntercept = event.target.closest(".trigger-popup") !== null;
if (!shouldIntercept && href) {
if (href === "#") {
shouldIntercept = true;
} else {
try {
const { pathname } = new URL(href, window.location.href);
// trigger on `/contact` and `/contact/`` but not `/contact/thanks`
// does not work on `/contact-...`` such as `/contact-us` unless you modify this regex
shouldIntercept = /\/contact\/?$/.test(pathname);
} catch (e) {
// unparseable href — ignore
}
}
}
if (shouldIntercept) {
event.preventDefault();
document.dispatchEvent(
new CustomEvent("gp-open-default-overlay", {
bubbles: true,
detail: { originalEvent: event },
})
);
//console.log('Custom event "gp-open-default-overlay" dispatched!');
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment