Hello, I’m a beginner at this and I want to redirect people who registered for the first time to a page to update their details. I managed to put together a code that brings existing users who login to their profile page, but for people who registered for the first time, it does redirect to the update profile page link but it will show an error page first and i have to manually refresh the page for it to work. The link is correct but I have to refresh it. Please help! Thank you.
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(“#button5”).label = “Logout”;
$w(“#button8”).show();
$w(“#button6”).show();
}
else {
$w(“#button5”).label = “Login”;
$w(“#button8”).hide();
$w(“#button6”).hide();
}
} );
export function button5_click(event) {
// user is logged in
if (wixUsers.currentUser.loggedIn) {
// log the user out
wixLocation.to(‘/home’);
wixUsers.logout()
.then( () => {
// update buttons accordingly
$w(“#button5”).label = “Login”;
$w(“#button8”).hide();
$w(“#button6”).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(“FreshieProfileData”)
.eq(“_id”, userId)
.find();
} )
.then( (results) => {
wixLocation.to(/freshie-profile-data-2/${wixUsers.currentUser.id}
);
// 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(“FreshieProfileData”, toInsert)
. catch ( (err) => {
console.log(err);
} );
wixLocation.to(/freshie-profile-data-1/${wixUsers.currentUser.id}
);
}
// update buttons accordingly
$w(“#button5”).label = “Logout”;
$w(“#button8”).show();
$w(“#button6”).show();
} )
. catch ( (err) => {
console.log(err);
} );
}
}
export function button6_click_1() {
wixLocation.to(/freshie-profile-data-2/${wixUsers.currentUser.id}
);
}
It looks like you are using this tutorial here for Members Profile, although you seem to have altered the code for some reason.
https://support.wix.com/en/article/corvid-tutorial-building-your-own-members-area
If you are using this tutorial then you are best moving the site member onto their profile page only and not their update profile page.
Also, note that with this tutorial, that whatever you capture on the signup page whether it just be email and password with the Wix default or custom sign up windows, or you use your own Corvid lightbox to sign up new members where you can capture whatever user input you want like first and last name, email, business, phone number etc.
That info will be the only thing that is displayed when the new site member visits their member profile page for the first time, then they have the chance to go to their member update profile page and add or edit whatever they want.
Finally, note that with this tutorial it will only work fully if you move the user onto another page.
If you keep the user on this same page after they have logged in, then they will need to refresh the page after the login or signup window closes as the code needs to be run twice for it to register the user being logged in.
That is the reason why it works if you redirect the user onto another page to begin with as when you return to this main page, the page code will have a chance to run again and show the user as logged in.
I have used this same tutorial for a members area setup on a site of mine and I keep the users on the same page, I simply have my Corvid login lightbox close and automatically refresh the main page itself so that the code is rerun and all teh member only parts of this page are then shown.
Without doing this the user will still be logged in, however the page itself won’t register the log in and it won’t show anything on the page that is member only.
Just to add as well, in your code with Wix Location, once you move the user onto another page then none of your code after that will be running as the user will be on another page.
@givemeawhisky Thanks for the explanation. I put this code in the Site section as I want ppl to be able to logout on whichever page they like, I have also put the buttons on the header. Does that make a difference?
And is there a way to make the page auto refresh so the code would work when redirecting to the update profile page? I have tried replacing the link with a lightbox so ppl will press “update profile” and be redirected from there instead, but the lightbox does not show up at all. 
Yes being in the header and in the site code is fine.
As for the code, you need to look at the code in the tutorial I already linked to in my previous reply and use that.
https://support.wix.com/en/article/corvid-tutorial-building-your-own-members-area
import wixUsers from 'wix-users';
import wixData from 'wix-data';
import wixLocation from 'wix-location';
$w.onReady( () => {
if(wixUsers.currentUser.loggedIn) {
$w("#loginButton").label = "Logout";
$w("#profileButton").show();
}
else {
$w("#loginButton").label = "Login";
$w("#profileButton").hide();
}
} );
export function loginButton_click(event) {
// user is logged in
if(wixUsers.currentUser.loggedIn) {
// log the user out
wixUsers.logout()
.then( () => {
// update buttons accordingly
$w("#loginButton").label = "Login";
$w("#profileButton").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("#loginButton").label = "Logout";
$w("#profileButton").show();
} )
.catch( (err) => {
console.log(err);
} );
}
}
export function profileButton_click(event) {
wixLocation.to(`/Members/${wixUsers.currentUser.id}`);
}
You only need the wixLocation.to() part at the end of your code as you have it, do not put in in between the code in other places like you have twice.
This is what I have done for my members page on a site using that tutorial link above as a starting point to work from.
import wixUsers from 'wix-users';
import wixData from 'wix-data';
import wixLocation from 'wix-location';
$w.onReady( () => {
if(wixUsers.currentUser.loggedIn) {
$w("#loginbutton").label = "Logout";
$w("#membersareaonlystrip").expand();
$w("#whitegapforfooter").hide();
}
else {
$w("#loginbutton").label = "Login";
$w("#membersareaonlystrip").collapse();
$w("#whitegapforfooter").show();
}
} );
export function loginbutton_onclick(event) {
// user is logged in
if(wixUsers.currentUser.loggedIn) {
// log the user out
wixUsers.logout()
.then( () => {
// update buttons accordingly
$w("#loginbutton").label = "Login";
$w("#membersareaonlystrip").collapse();
$w("#whitegapforfooter").show();
} );
}
// user is logged out
else {
let userId;
let userEmail;
// prompt the user to log in
wixUsers.promptLogin( {"mode": "signup"} )
.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("#loginbutton").label = "Logout";
$w("#membersareaonlystrip").expand();
$w("#whitegapforfooter").hide();
} )
.catch( (err) => {
console.log(err);
} );
}
}
export function profilebutton_onclick(event) {
wixLocation.to(`/Members/${wixUsers.currentUser.id}`);
}
export function entermembersbutton_onclick(event) {
wixLocation.to(`/members-area`);
}
export function myaccountbutton_onclick(event) {
wixLocation.to(`/account/my-account`);
}
export function websiteupdatebutton_onclick(event) {
wixLocation.to(`/website-update`);
}
Along with my own Corvid lightbox for signup.
import wixUsers from 'wix-users';
import wixWindow from 'wix-window';
import wixLocation from 'wix-location';
$w.onReady(function () {
$w("#registerButton").onClick( (event) => {
let email = $w("#email").value;
let password = $w("#password").value;
let first = $w("#firstName").value;
let last = $w("#lastName").value;
wixUsers.register(email, password, {
contactInfo: {
"firstName": $w('#firstName').value,
"lastName": $w('#lastName').value,
}
} )
.then( (result) => {
let resultStatus = result.status;
wixWindow.lightbox.close();
wixLocation.to("/sign-in-status"); //Change the URL ending to whatever page you want to send the user to after they log in.
} );
} );
});
This works perfectly and closes after registering details before moving uwser onto the sign in status page, then both names will be saved in Contacts in the Wix Dashboard and once site member is approved the member details will be added to ‘members’ database from the tutorial.
This is my Corvid login lightbox for if you want to move user to another page after the user logs themselves in.
import wixUsers from 'wix-users';
import wixLocation from 'wix-location';
import wixWindow from 'wix-window';
$w.onReady(function () {
$w("#forgotPassword").onClick( (event) => {
//wixWindow.lightbox.close()
wixUsers.promptForgotPassword()
.then( ( ) => {
//
} )
.catch( (err) => {
let errorMsg = err; //"The user closed the forgot password dialog"
});
});
});
export function loginButton_click(event) {
let email = $w("#email").value;
let password = $w("#password").value;
wixUsers.login(email, password)
.then( () => {
console.log("User is logged in");
wixLocation.to("/account/my-account"); //Change the URL ending to whatever page you want to send the user to after they log in.
} )
.catch( (err) => {
console.log(err);
$w("#errorMessage").expand(); // You can delete this line if you are not going to add an error message. Use a regular text element set to 'collapse on load' from the Properties Panel.
} );
}
This is my Corvid login lightbox if you want the user to stay on the same page as they were on when they clicked to open he lightbox, so that it refreshes the page and the code runs again which makes it read that the user is now logged in and everything works as it should.
import wixUsers from 'wix-users';
import wixLocation from 'wix-location';
import wixWindow from 'wix-window';
$w.onReady(function () {
$w("#forgotPassword").onClick( (event) => {
//wixWindow.lightbox.close()
wixUsers.promptForgotPassword()
.then( ( ) => {
//
} )
.catch( (err) => {
let errorMsg = err; //"The user closed the forgot password dialog"
});
});
});
export function loginButton_onclick(event) {
let email = $w("#email").value;
let password = $w("#password").value;
wixUsers.login(email, password)
.then( () => {
console.log("User is logged in");
wixWindow.lightbox.close();
wixLocation.to(wixLocation.url); //This reloads the same page and allows code to show hidden member parts.
} )
.catch( (err) => {
console.log(err);
$w("#errorMessage").expand(); // You can delete this line if you are not going to add an error message. Use a regular text element set to 'collapse on load' from the Properties Panel.
} );
}
Have a look at Nayeli (Code Queen) webpages where she takes you through adding custom signup and login lightboxes to your site. This should hopefully help you understand the workings of it, instead of me just chatting here about it.
https://support.totallycodable.com/en/article/create-custom-log-in-sign-on-screen-using-wix-code
https://support.totallycodable.com/en/article/custom-registration-for-site-login-using-wix-code