Multiple Passwords protected page

Is there a way to add multiple passwords to a password protected page? I want to give access to a handful of users by allowing them to enter their password (their email) to allow entry.

Vague question. Please elaborate. (why won’t you set the access to “Memebers only” and then they’ll have to login using their pw?)

It’s a wholesale pricing page that I want to restrict visibility exclusively to my retailers. I don’t want a membership option, I just want a password to allow entry. But instead of having one universal password, they can enter their email or store name as a password. I will set up beforehand those emails or store names as accepted passwords that will allow entry.

@sukkahartwork As far as I know, you can’t set passwords for password protected pages via Corvid.
However, you can create it yourself and only show the contents after the user submitted a password form.
How exactly to do it depends on the security level you need.
If you only want to hide the contents from the average users then it’s one thing.
If you want to hide the contents from users with technological knowledge who can access some hidden contents then it’s another approach.

@jonatandor35 I just don’t want it visible to the average user. Until now I just had the page hidden from the menu and would give out the link to my retailers and that was sufficient. But I now see that the page is coming up in google search results even though I turned that off.

@sukkahartwork So you can create a databases with the email passwords.
On the page you can put a multi state box.
On the 1st state put a user input “password” and a “Submit button”,
On the 2nd state put the page contents.
Once the user filled in the password and click the “Submit button” you run a query to see if the password exist in the database. If it exists you change to state 2.

import wixData from 'wix-data';
$w.onReady(() => {
$w("#submitButton").onClick(event => {
wixData.query("CollectionName")
.eq("password", $w("#passwordInput").value)
.find()
.then(r => {
if(r.items.length > 0){
$w("#multiStateBox").changeState("state2");
}
})
})
})

(There’re other ways to achieve that. But this should be easy)

@jonatandor35 Got it. sounds good. Thanks for you help!!

You’re welcome :slight_smile:

Hi J.D.,

Im working on something similar. The code works when I test it in preview, but when I publish and try it on the live site, the multistate box doesn’t switch to state2. This is the code on the Home page:

import wixData from 'wix-data';
$w.onReady(() => {
    $w("#button4").onClick(event => {
        wixData.query("AccessCodes")
            .eq("title", $w("#input5").value)
            .find()
            .then(r => {
                if (r.items.length > 0) {
                    $w("#statebox8").changeState("State2");
                }
            })
    })
})


Any ideas on how to get it to work on the live site?

  1. Check the permissions of the AccessCodes collection. Maybe they’re limited to Admin-only (then set them to Everyone).

  2. If youwork with a sendbox version of this collection, make sure the data exist on the live version.

I think that was it. Got it working now, appreciate it!

I got one more question about adding a third state. I want to add a button to second state that once clicked with go to third state. When I add the onclick function, the original code for the access code doesn’t work any more. Is there a way to add the onclick code that won’t interfere with the original access “code” that advances to the second state?.

Please post your code

This is the code, I’m trying to have a button on state 2 (button 7) that will go to state 3 once clicked.

import wixData from ‘wix-data’ ;
$w . onReady ( function () {
$w ( “#button4” ). onClick ( event => {
wixData . query ( “AccessCodes” )
. eq ( “title” , $w ( “#input5” ). value )
. find ()
. then ( r => {
if ( r . items . length > 0 ) {
$w ( “#statebox8” ). changeState ( “State2” );
}

        }) 
}) 

})
$w ( ‘#button7’ ) on . onClick ( event => {})
$w ( ‘#statebox8’ ). changeState ( “State3” ))

  1. The last two lines must be inside the $w.onReady block.

  2. The second line from the bottom, contains an empty event handler. Why?

  3. The second line from the bottom contains a syntax error (remove the first “on”).

  4. The last line is set to run on page load. Is that what you wanted?

Actually, I think I just got it to work. I was putting it on the wrong line from before. Thanks for pointing that out. Does this look right?

import wixData from ‘wix-data’ ;
$w . onReady ( function () {
$w ( “#button4” ). onClick ( event => {
wixData . query ( “AccessCodes” )
. eq ( “title” , $w ( “#input5” ). value )
. find ()
. then ( r => {
if ( r . items . length > 0 ) {
$w ( “#statebox8” ). changeState ( “State2” );
}

        }) 
}); 
$w ( "#button7" ). onClick (() => { 
    $w ( "#statebox8" ). changeState ( "State3" ); 
} ); 

})