CREDIT: Oli Ver.
This logout confirmation popup should be native in voxel for sure! This is a great UX for confirming when a user wants to log out.
See it in action on The Voxel Guide.
This goes under functions.php on your child theme.
function custom_logout_without_confirmation() {
if (isset($_GET['appout'])) {
wp_logout();
wp_redirect(home_url());
exit();
}
}
add_action('init', 'custom_logout_without_confirmation');
This goes in the URL field of any button or wordpress menu item.
?appout=true
Add this using the FluentSnippets plugin (free) to add to the header so it works on all pages OR add it to the HTML element on the page you have the log out button on.
window.addEventListener("load", function () {
document.addEventListener("click", function (e) {
var link = e.target.closest('a[href*="?appout=true"]');if (link) {
// prevent the default link behavior
e.preventDefault();// Check if Voxel is defined and show the alert
if (typeof Voxel !== "undefined") {
Voxel.alert("Would you like to log out?", "info");// Wait until the DOM is updated with the alert box
setTimeout(function () {
// Find the close alert button and customize it
var closeAlertBtn = document.querySelector(
".ts-btn.ts-btn-4.close-alert"
);if (closeAlertBtn) {
closeAlertBtn.textContent = "Log out now";closeAlertBtn.addEventListener(
"click",
function (event) {
event.preventDefault();
window.location.href =
link.getAttribute("href");
}
);
}
}, 0);
}
}
});});