How can I create a "log-out" button in Webflow for a members-only page? I want to be able to redirect the logged-in users from the "Home" page to the "Log-in" page when they choose to log out. Additionally, I'd like to allow clients to view the log-in page and enable users to log out from any computer. See the provided read-only link for more details.

To create a log-out button in Webflow for a members-only page, you need to use Webflow’s Memberships or third-party authentication services. Since Webflow doesn’t provide a built-in log-out button yet, you'll need to use JavaScript to clear the session and redirect the user to the login page.

1. Add a Log-Out Button

• Create a button in your Webflow project where you want the log-out functionality.
• Set its ID to "logout-btn" (or any identifier of your choice).

2. Add JavaScript for Session Logout

• Open the Page Settings of the page where the logout button appears.

• Scroll to the Before tag section and insert the following code:

  ```javascript
  document.addEventListener("DOMContentLoaded", function() {
  const logoutButton = document.getElementById("logout-btn");
  if (logoutButton) {
  logoutButton.addEventListener("click", function() {
  // Clear authentication session (adjust based on your authentication provider)
  localStorage.removeItem("wf-auth");
  sessionStorage.removeItem("wf-auth");

          // Redirect to the login page        window.location.href = "/login"; // Update with your actual login page URL    });}

  });
  ```

3. Ensure Users Are Redirected After Logout

• If you are using Webflow Memberships, logged-out users will be redirected automatically when trying to access gated content.
• If using an external authentication system like Outseta or Memberstack, configure auto-logout behavior in their settings.

4. Allow Access to the Login Page

• In Webflow Memberships, ensure the Login page is set to be publicly accessible under User Access Settings.
• If using Memberstack, set login pages as available to all users in its dashboard.

5. Enable Logout from Any Computer

• Logging out from one device may not log out other devices unless your authentication provider enforces session invalidation.
• If using Memberstack, enable session expiration in settings to log users out universally after signing out.

Summary

To add a logout button in Webflow, create a button with an ID, then use JavaScript to clear the session and redirect users to the login page. Ensure the login page is publicly accessible, and configure session settings if using a third-party authentication service.