Add a login/logout link to navigation

Can you supply the Javascript to add a login link to the header? I don’t want signup just login. If current user is logged in it should say logout; otherwise it should say login and open the login screen. I did the tutorial to put a login button on a page but i need a link on all pages in the header. Please help!

Hi Adam,

You can place the login and profile buttons on your header (which is always visible) and move the code to the site code section.

Note that you can control which option (sign up /login) is shown first, however it is not possible to completely disable neither option.

As an alternative, you can require approval for new site members.

See more about site code here .

Have you ever tried this? It breaks the code for me. I have to debug it but it breaks the code. Is there a reason you would choose a button and can’t do a normal link? If it was a link, what element would you use? Like add a Text element? Also, do IDs of buttons change when you move them? I have to try again but I thought when I moved it the ID incremented, no? Also, the login page - does that need to be associated with a page or can it just popup over any page?

Hi Adam,

Login page can be popped up by any page. Two ways for that:

  1. Using a built in login button.
  2. using whatever element you want (text/button) with some code. see here the code.

If by ‘breaks the code’ you relate to moving the button to the header, note that you need to reset the onClick function from the properties panel.

Hope this helps,
Liran.

OK, after login, it redirects back to the home page but “Login” doesn’t change to “Logout”. Then I refresh the page and it does. Is there a way to force this update of the text after login or, to location.reload():?

Just use wixUser.currentUser to check if user is logged in, and update the button label accordingly.
example:

const currentUser = wixUsers.currentUser;
if (currentUser.loggedIn) {
    $w('button1').label = 'Log out';
} else {
    $w('button1').label = 'Log in';
}

Liran.

hello where can i find thoses codes in french or get the button to be directed to a french google log in page?

Hi Esther!

You can change the login page language by following this guide.

Best of luck!
Doron. :slight_smile:

Actually I created my own button for the french version of site, the codes i used to create it leads this button to the english google sign in bit i need it to go the french one. Thats why im asking for the french code that can direct the button to the french google login

The following code requires to know the button id? if so, where do I find the button id?

$w('button1').label = 'Log out';