Bypass custom lightbox login if user is already logged in

Discussion Ask a question
,
1

I created custom login lightbox that’s accessed from a link on the main menu of the site. What code do I need to add for it to bypass the lightbox if the user is already logged in?

2

It is accessed from a link on the main menu of your home page then surely you wouldn’t need to bypass it? If they are already logged in, why would they be clicking on the login link again?

If you’ve set it to popup automatically then just turn that off and have them click on the login link only.

Or just do something like this in your code:

$w.onReady( () => {
if(wixUsers.currentUser.loggedIn) {
$w("#loginButton").label = "Logout";
$w("#loginlightboxlink").hide();
}
else {
$w("#loginButton").label = "Login";
$w("#loginlightboxlink").show();
}
} );

This will change your login button to say logout if already logged in and will hide your login lightbox link if logged in too.

If you don’t want a button for login/logout, then don’t have one and just take out those two lines of code.

Here is the full code if you wanted to elaborate more with it:

Obviously, you don’t have to use the code sample on the page for exactly what they have done it for, you can modify it to suit your own needs, like I have done for my own members page on my own website.

Otherwise, if you wanting the login lightbox to popup regardless then try this:

The following code goes in the page code for the lightbox itself and not the page where your main menu is:

import wixUsers from 'wix-users';
import wixWindow from 'wix-window';

$w.onReady(() => {
	if (wixUsers.currentUser.loggedIn) {
		wixWindow.lightbox.close('CustomLoginLightbox');
	} else {
		wixWindow.openLightbox('CustomLoginLightbox');
	}
});

Set the lightbox to open automatically from the lightbox settings screen, the lightbox will open if the user is not logged in and will not open if the user is logged in.

If you ever wanted to do a one time popup, then see this Wix link too:

3

Thanks @givemeawhisky for the reply. I think I did a garbage job of explaining exactly what I was trying to do but you provided some of what I was looking for.

I really wasn’t wanting to bypass the login if the user was already logged in. I more so was wondering how to bypass the login if a user was already logged in for other member only pages that are linked on the main menu. However, after thinking about it I think I’m going to maybe make the those buttons appear after the user logs in like My Profile button from this guide: Velo Tutorial: Building Your Own Members Area | Help Center | Wix.com

A couple follow up questions though. I followed the guide linked above to create the login/logoff button. However, it uses the default Wix login instead of my custom lightbox login I created. How do I link that code to my lightbox instead?

Also, is there anyway to show the logged in users name like the default accountNavBar to work with the code from the above guide? The logged in username and profile picture is a nice touch it’s just sad the accountNavBar doesn’t play well with custom login/logoff code.

Thanks again.

4

@givemeawhisky this is the current code I have, I just need to know how to call the custom login lightbox I have instead of the default Wix login page when the login button is clicked.

import wixUsers from ‘wix-users’;
import wixData from ‘wix-data’;
import wixLocation from ‘wix-location’;
import wixWindow from ‘wix-window’;

$w.onReady( () => {
if (wixUsers.currentUser.loggedIn) {
$w(“#loginButton1”).label = “Logout”;
$w(“#profileButton1”).show();
}
else {
$w(“#loginButton1”).label = “Login”;
$w(“#profileButton1”).hide();
}
} );

export function loginButton1_click(event) {
// user is logged in
if (wixUsers.currentUser.loggedIn) {
// log the user out
wixUsers.logout()
.then( () => {
// update buttons accordingly
$w(“#loginButton1”).label = “Login”;
$w(“#profileButton1”).hide();
} );
}
// user is logged out
else {
let userId;
let userEmail;

// prompt the user to log in
wixUsers.promptLogin( {“mode”: “login”} )
.then( (user) => {
userId = user.id;
return user.getEmail();
} )
.then( (email) => {
// check if there is an item for the user in the collection
userEmail = email;
return wixData.query(“Members”)
.eq(“_id”, userId)
.find();
} )
.then( (results) => {
// if an item for the user is not found
if (results.items.length === 0) {
// create an item
const toInsert = {
“_id”: userId,
“email”: userEmail
};
// add the item to the collection
wixData.insert(“Members”, toInsert)
. catch ( (err) => {
console.log(err);
} );
}
// update buttons accordingly
$w(“#loginButton1”).label = “Logout”;
$w(“#profileButton1”).show();
} )
. catch ( (err) => {
console.log(err);
} );
}
}

export function profileButton1_click(event) {
wixLocation.to(/Members/${wixUsers.currentUser.id});
}

5

https://support.wix.com/en/article/corvid-enabling-custom-site-registration

For members name, just simply add the members dataset to the page and connect their user name or first name onto the page.

By the way, if you use your above code from that tutorial, then you will need the lightbox to refresh the page when it closes, otherwise the code on the page will not work.

6

Hello,

I was facing the same issue. Found this code on another forum and it works perfectly for stopping the lightbox appearing for members who are logged in. You just need to go to your admin panel, go to settings, scroll to the bottom to custom code → in there paste the code, select the page where your lightbox appears, and add it to body-end. Done.

import wixUsers from ‘wix-users’;
import wixWindow from ‘wix-window’;

$w.onReady(() => {

if (wixUsers.currentUser.loggedIn) { 
	wixWindow.lightbox.close('Welcome'); 
} else { 
	wixWindow.openLightbox('Welcome'); 
}

});