Hi everyone!
I’ve already got my registration custom form that works perfectly .
Now, I’m trying to create a Custom Log in form but it seems impossible, please can anyone help me? Which code I need to use so my members can log in to my site?
Thanks!
Eduardo
Place that code inside onClick function of your login button
import wixUsers from 'wix-users';
let email =$w('id_of_email_inputfield').value // email address of user to log in
let password =$w('id_of_password_inputfield').value // password of user to log in
wixUsers.login(email, password)
.then( () => {
console.log("User is logged in");
} )
.catch( (err) => {
console.log(err);
} );
Hi Umair, Thank you for your help, Do you refer that I put your code in this part?
Sorry I’m code beginner
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( ( ) => {
//
(Here?)
} )
. catch ( (err) => {
let errorMsg = err; //“The user closed the forgot password dialog”
});
});
});
export function loginButton_onclick(event) {
let email = $w(“#loginEmail”).value;
let password = $w(“#loginContrasena”).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);
} );
}
Yeah man feel free to use this code
Don’t mash the two codes together as you are then duplicating the login process.
This is fine for a login lightbox.
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.
} );
}
See Nayeli (Code Queen) tutorial here and they will guide you all through it easily.
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
@givemeawhisky thank you too. I just did same has Code Queen but doesn’t work, I can’t log in. Do you think that is because I didn’t connected to a database?
@shotdesignmexico Why you are trying over preview mode please try to login over published site.
It will not work in preview mode
Exactly, never test Wix Users API in preview mode.
https://www.wix.com/corvid/reference/wix-users.html
The APIs in wix-users are only partially functional when previewing your site. View a published version of your site to see their complete functionality.
